问答博客资讯标签用户活动
logo极客观点logo项目管理logoHarmonyOS
javascript
前端
python
node.js
react
vue.js
php
laravel
go
人工智能
mysql
linux
ios
java
android
css
typescript
spring
程序员
logoONES 研发管理logo思否企业问答logo安谋科技 XPU

通过jquery 修改的dom 无法使用jquery的方法

头像
行云流水
    792916
    头像
    joyqi
    16.2k3894100
    <body>    
    <span class="title" id='color_but'>    
    点击此处为标题添加颜色    
    </span>    
</body>  


<script type='text/javascript'>  
    $('#color_but').click(function(){  
        $(this).replaceWith("<input  id='ok' type='button'value='确定'/>")  
    });  
    
    $('#ok').click(function(){  
        alert('ddd');      
    });      
</script>

    通过jquery修改后的button是无法触发的，这是为什么 如果是使用onClick绑定的事件就可以触发，应该是一个基础的问题，一直以为可以这么用的~~

    html前端webjquery
    阅读 6k
    5 个回答
    得票最新
    头像
    P酱
      3.2k21021
      ✓ 已被采纳

      你对#ok的绑定操作在js执行到这行时就进行了，但得你生成这个#ok要到你点击#color_but之后才出现。
      结果就是你在执行绑定#ok的时候，这个#ok还根本没出现。

      就你的代码而言，我不知道你的具体应用场景。你绑定部分可以试试代理delegate或者使用 jq 推荐的 on
      以下几种都可以

      $('body').delegate( '#ok', 'click', function() {
    alert('ddd')
})

$('body').on('click', '#ok', function() {
    alert('ddd')
})

      总之是需要在已存在的上层进行绑定。

      头像
      史蒂芬周五
        9512

        用

        $('#ok').live('click',function(){
    //...
});

        或 （jq 2.0+）

        $( "body" ).on( "click", "#ok", function() {  //... });
        头像
        woody
          2.9k1511

          不该直接写$(this).click， 这是最初级的写法， 但凡对jQuery有点了解都不该这么写。

          头像
          宋小北
            4.8k51954

            新添加的元素必须先绑定（live、on）~~ 详细看手册

            头像
            BadGuy
              3812

              问题的关键点：
              1.<input id='ok' type='button'value='确定'/> 是 未来元素；
              2.click时间不支持未来元素；

              你要了解:
              a)什么事未来元素；
              b)哪些JQ方法支持未来元素；

              问题答案：

              1. 不支持绑定未来元素的方法：click

              2. 支持绑定未来元素的方法：on,delegate

              撰写回答
              你尚未登录，登录后可以
              • 和开发者交流问题的细节
              • 关注并接收问题和回答的更新提醒
              • 参与内容的编辑和改进，让解决方法与时俱进
              推荐问题