weixin_33711641 2013-11-09 18:27 采纳率: 0%
浏览 85

jQuery on('change')无效

I'm working with ajax forms where based on a select element value change, an ajax request is sent to the server, then in response a json string is returned. I build the second form based on this json string. the problem is I want to make a third select element based on second select element value change(the one that is generated via javascript). in this situation when i want to work with change event, it doesn't work:

My javascript code so far:

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;
    });
  • 写回答

1条回答 默认 最新

  • weixin_33694172 2013-11-09 18:35
    关注

    You'll need a delegated event handler for that as you're replacing #model with a new dynamic element :

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

报告相同问题?

悬赏问题

  • ¥15 求差集那个函数有问题,有无佬可以解决
  • ¥15 【提问】基于Invest的水源涵养
  • ¥20 微信网友居然可以通过vx号找到我绑的手机号
  • ¥15 寻一个支付宝扫码远程授权登录的软件助手app
  • ¥15 解riccati方程组
  • ¥15 display:none;样式在嵌套结构中的已设置了display样式的元素上不起作用?
  • ¥15 使用rabbitMQ 消息队列作为url源进行多线程爬取时,总有几个url没有处理的问题。
  • ¥15 Ubuntu在安装序列比对软件STAR时出现报错如何解决
  • ¥50 树莓派安卓APK系统签名
  • ¥65 汇编语言除法溢出问题