Question

我正在使用ajax表单，其中基于select元素值更改，ajax请求被发送到服务器，然后作为响应返回json字符串。我基于这个json字符串构建第二个表单。问题是我想基于第二个选择元素值更改（通过javascript生成的那个）创建第三个选择元素。在这种情况下，当我想使用更改事件时，它不起作用：

到目前为止我的javascript代码：

jQuery("#make").on('change',function(){
        var value = jQuery(this).val();
        if(value != 0)
        {
            jQuery.getJSON("<?php echo site_url('ajax/get/models'); ?>",
                {makeId:value},
                function(data){
                    if(data != "false")
                    {
                        var modelsSelect = document.createElement('select');
                        modelsSelect.setAttribute('name','model');
                        modelsSelect.setAttribute('id','model');
                        var modelOption =  document.createElement('option');
                        modelOption.setAttribute('value',0);
                        modelOption.appendChild(document.createTextNode("sample text"));
                        modelsSelect.appendChild(modelOption);
                        jQuery.each(data, function(index, item) {
                            var modelOption =  document.createElement('option');
                            modelOption.setAttribute('value',item.id);
                            modelOption.appendChild(document.createTextNode(item.model.toString()));
                            modelsSelect.appendChild(modelOption);
                        });
                        jQuery("#model").replaceWith(modelsSelect);
                        return false;
                    }
                    else
                    {
                        return false;
                    }
                }
            );
        }
        else
        {
            var modelsSelect = document.createElement('select');
            modelsSelect.setAttribute('name','model');
            modelsSelect.setAttribute('id','model');
            modelsSelect.setAttribute('disabled','disabled');
            var modelOption =  document.createElement('option');
            modelOption.setAttribute('value',0);
            modelOption.appendChild(document.createTextNode("sample text"));
            modelsSelect.appendChild(modelOption);
            jQuery("#model").replaceWith(modelsSelect);
            return false;
        }
    });
    jQuery("#model").on('change',function(){
        alert("change");// THIS DOES NOT WORK
        return false;
    });

Answer 1

当你用新的动态元素替换#model时，你需要一个委托的事件处理程序：

jQuery(document).on('change', '#model', function(){
    alert("change");
    return false;
});

jQuery on（'change'）不起作用

1 个答案: