zoukankan      html  css  js  c++  java
  • dom元素新增后不会触发事件

    <!DOCTYPE HTML>
    <html>
    <head>
    <title>checkbox设置只能单选</title>
    <script type="text/javascript" src="http://lib.sinaapp.com/js/jquery/1.7.2/jquery.min.js">
    </script>
    
    </head>
    <body>
    <p>您喜欢的水果?</p>
    <button id="add">新增</button>
    <form>
        <div id="checkboxDiv" >
            <input type="checkbox" name="checkboxName" value="1" />苹果<br/>
            <input type="checkbox" name="checkboxName" value="2" />西瓜<br/>
            <input type="checkbox" name="checkboxName" value="3" />香蕉<br/>
            <input type="checkbox" name="checkboxName" value="4" />桃子<br/>
            <input type="checkbox" name="checkboxName" value="5" />芒果<br/>
        </div>
    </form>
    <script type="text/javascript">
    $(document).ready(function(){
    
        $("#checkboxDiv").on("click", "input", function(){
            if($(this).is(':checked')){ 
                $(this).attr('checked',true).siblings().attr('checked',false);
            }else{
                $(this).attr('checked',false).siblings().attr('checked',false);
            }
        })
    
        $("#add").click(function(){
            $("#checkboxDiv").append("<input type='checkbox' name='checkboxName' value='6' />梨子<br/>");
        })
    });
    
    </script>
    </body>
    </html>
    

      新增的元素一定要在$("#父元素")内

  • 相关阅读:
    二叉树
    树的存储表示
    Jarvis OJ | WEB
    xctf | pwn进阶
    《C++Primer Plus》 | 处理数据
    xctf---stack2 | gdb&IDA 调试
    IDA | Windows主机与Ubuntu 16.04远程调试
    ROP | 中级
    IDA | 窗口
    epub reading
  • 原文地址:https://www.cnblogs.com/yewook/p/11431214.html
Copyright © 2011-2022 走看看