JQuery单击附加元素不适用于下拉

Question

在我清空下拉菜单的内容并添加新内容后，我无法让下拉菜单继续工作。

这是我遇到问题的页面（请先尝试选择壁纸分辨率，然后从顶部的 5 中选择不同的壁纸并重试）： http://www.nba.com/warriors/wallpapertest_020.html

在 $(document).ready 我有：

        $(".dropdown dd ul li a").click(function() {
            var text = $(this).html();
            $(".dropdown dt a span").html(text);
            $(".dropdown dd ul").hide();
        });

这第一次工作正常，但是当我更改下拉列表的内容时，它停止工作。有没有办法调用 .ready() 函数来识别新添加的内容？或者有更好的方法来做到这一点？

我也尝试过这样的 delegate()，但这会阻止它完全发挥作用：

       $(".dropdown dd ul li").delegate('a', 'click', function() {
            var text = $(this).html();
            $(".dropdown dt a span").html(text);
            $(".dropdown dd ul").hide();
        });

任何帮助将不胜感激:)

Answer 1

尝试使用on()

$(".dropdown dd ul li a").on('click', function() {
            var text = $(this).html();
            $(".dropdown dt a span").html(text);
            $(".dropdown dd ul").hide();
        });