zoukankan      html  css  js  c++  java
  • jquery 未来元素事件示例 on() delegate() live()

    jquery 1.7版后建议使用on()

    $(document).on("click","#green",function(){$(this).after('<a target="_blank" href="http://www.cnblogs.com/afish">小鱼阁</a>');});
    $(document).delegate("#green", "click", function(){$(this).after('<a target="_blank" href="http://www.cnblogs.com/afish">小鱼阁</a>');});
    $("#green").live("click", function(){$(this).after('<a target="_blank" href="http://www.cnblogs.com/afish">小鱼阁</a>');});

    下面是示例代码:

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
    <title>jquery 未来元素事件示例 on() delegate() live()</title>
    <style>
    #green{ border:3px solid #ddd; 200px; height:100px}
    .green{ border:3px solid #900; 200px; height:100px}
    </style>
    <script src="http://code.jquery.com/jquery-latest.js"></script>
    <script>
    $(document).ready(function(){
        $("#button").one("click", function(){
            $(this).after('<p id="green">我是点击按钮新增的元素,点击我也可以增加一个段落</p>');
        });
        $(document).on("click","#green",function(){
            var $this = $(this);
            if (!$this.data('isClick')){//判断是否点击过一次,限制只执行一次以下代码,与one功能类似
                $this.data('isClick', 1);
                $(this).after('<p class="green">我是点击未来元素新增的段落</p>');
            }
        
        });
    });
    </script>
    </head>
    
    <body>
    <input name="button" id="button" type="button" value="增加一个段落" />
    </body>
    </html>
    转载请注明出处!小鱼阁工作室 -专注zencart建站,织梦企业建站,ecshop商城,二次开发,产品采集,模板修改!技术QQ 631992791
  • 相关阅读:
    Django: 获取头信息
    好用工具:火狐浏览器的境内境外版本区分
    Django: request.GET.get()
    es6: 展开运算符
    Vue: 配置axios基准路径并使用
    js: 获取Blob的值
    ApiPost: Error:ESOCKETTIMEDOUT
    Vue错误:Cannot read properties of undefined (reading '$router')
    git报错:error: Your local changes to the following files would be overwritten by checkout:
    Django: request.query_params取值
  • 原文地址:https://www.cnblogs.com/afish/p/3929042.html
Copyright © 2011-2022 走看看