zhoujunfei1990 2021-03-18 16:20 采纳率: 50%
浏览 93
已采纳

js异步的问题,callback函数触发次数的问题

<body>
<button id="new">new</button>

<h3>testH3</h3>


<script>
    $(function () {
        $('h3').click(function () {
                    alert($(this).text());
                });
        
        $('#new').click(function () {
            $.getJSON("/app3/testajax/", null, function (result) {
                let $body = $('h3').parent();
                let $new = $('<h3></h3>');
                $new.text('new added');
                $body.append($new);
             

            });
        });
    });
</script>
<body>

有一个h3标签,在点击的时候可以弹出h3的内容;

有一个button,每按一次会新增一个h3标签;

但是问题是点击button新增的h3标签不会触发click事件,只有原有点击原有的h3会触发click事件。

为了解决这个问题我把代码改成了这样

<script>
    $(function () {
        $('#new').click(function () {
            $.getJSON("/app3/testajax/", null, function (result) {
                let $body = $('h3').parent();
                let $new = $('<h3></h3>');
                $new.text('new added');
                $body.append($new);
                $('h3').click(function () {
                    alert($(this).text());
                })

            });
        });
    });
</script>

虽然开始的问题解决了,但是出现了新问题,每多新增一个h3,点击h3的时候会多次触发click事件,请大神帮忙这个怎么解决

  • 写回答

3条回答 默认 最新

  • 禅思院 前端领域优质创作者 2021-03-18 16:42
    关注
          $(function () {
                    $('h3').click(function () {
                        alert($(this).text());
                    })
              $('#new').click(function () {
                  $.getJSON("/app3/testajax/", null, function (result) {
                      let $body = $('h3').parent();
                      let $new = $('<h3></h3>');
                      $new.text('new added');
                      $new.click(function () {
                        alert($(this).text());
                      })
                      $body.append($new);
       
                  });
              });
          });
    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
查看更多回答(2条)

报告相同问题?

悬赏问题

  • ¥15 安装svn网络有问题怎么办
  • ¥15 Python爬取指定微博话题下的内容,保存为txt
  • ¥15 vue2登录调用后端接口如何实现
  • ¥65 永磁型步进电机PID算法
  • ¥15 sqlite 附加(attach database)加密数据库时,返回26是什么原因呢?
  • ¥88 找成都本地经验丰富懂小程序开发的技术大咖
  • ¥15 如何处理复杂数据表格的除法运算
  • ¥15 如何用stc8h1k08的片子做485数据透传的功能?(关键词-串口)
  • ¥15 有兄弟姐妹会用word插图功能制作类似citespace的图片吗?
  • ¥15 latex怎么处理论文引理引用参考文献