Question

我使用AJAx和PHP动态生成了数据库中的葡萄酒类型列表这是函数

function wineTypeHandler(data){
            var Type = data.Type;
            var countType = data.countType;
            for(var i = 0; i < countType; i++){

                $("#selectType").append(

                $("<input />").attr({
                  type: 'checkbox',
                    name: 'Type',
                    class: 'wineTypeCheck',
                     value: Type[i]
                  }), Type[i] + "<br />"
            );
            }   
        }

正如你所看到的，我已经将结果“附加”到了一个id为selectType的div，这整个工作正常，我唯一的问题是当我想根据从这个列表中检查过的内容更新另一个列表时，它不会回应任何事情！当我尝试这一个和许多其他方式

$(document).ready(function(){

$(':checkbox').click(function(){
alert('started');

    // other code
        return true;

});

}）;

它没有提醒任何事情！任何人都可以帮我解决这个问题。

提前谢谢。

Answer 1

.click()将自身附加到创建DOM时存在的元素。您的元素是动态生成的，因此.click()实际上并未应用它们。

您应该使用.live()来定位动态生成的元素，因为它会将自身附加到最初加载DOM之后创建的任何元素。我还建议使用change事件而不是click：

$(':checkbox').live('change', function(){
  // No need to return true;
});

Answer 2

这是因为您在页面加载后但在动态创建复选框之前分配了点击功能根据您使用的jQuery版本，您可以使用on()（对于jQuery版本1.7或更高版本），delegate()（对于旧版本的jquery）或live（）（简单但低效）函数将事件注册到动态创建的元素。

Answer 3

该事件仅限于现有元素。您需要使用live

$(':checkbox').live("click", function(){
    alert('started');
});

编辑：

从jQuery 1.7开始，不推荐使用.live()方法。使用.on（）附加事件处理程序。旧版jQuery的用户应该使用.delegate（）而不是.live()。

jQuery 1.4.3+使用delegate

$(#selectType).delegate(':checkbox', "click", function(){
    alert('started');
});

jQuery 1.7+使用on

$(#selectType).on("click", ':checkbox', function(){
    alert('started');
});

Answer 4

试试这个

$(':checkbox').live('change', function(){

});

Answer 5

在将元素添加到DOM之后，您需要绑定click事件。这是JavaScript开发的一个流行问题。我建议创建一个设置bind事件的函数，并在append调用之后调用它（以及jQuery（document）.ready（））。

编辑：我看到很多关于jQuery.live的建议（）重要的是要注意jQuery的live（）方法已被弃用，不应该使用。

jquery附加复选框，如果选中，它不会返回任何内容？

5 个答案: