JQueryでDOMノードを動的に追加する方法を解決します。元のクリックイベントは無効です。

質問の例については、以下を参照してください

<html>
  <div id="spanArray">
        <span class="spanOne">我是原有标签,点击我控制台输出信息</span>
    </div>

<script>
        //新生成的元素点击无效果
        $(".spanOne").click(function() {
                console.log("我是一个标签");
                $("#spanArray").append('<br><span class="spanOne">我是新生成的标签,点击我控制台没有效果</span><br>')
            })
</script>            

解決策1:推奨



        $(document).on('click', function() {
            console.log("我是一个标签");
            $("#spanArray").append('<br><span class="spanOne">我是新生成的标签,点击我此时有效果</span><br>')

        })
     //   $("#spanArray") 为新增加的dom节点所在的父元素, '.spanOne'是添加节点的class属性
     
       或者
       
        $("#spanArray").on('click', '.spanOne', function() {
                console.log("我是一个标签");
                $("#spanArray").append('<br><span class="spanOne">我是新生成的标签,点击我此时有效果</span><br>')
            })
            //以上的两种方式都可以,都是利用了事件的捕获

     
    

解決策2:推奨されません。使用できるのは下位バージョンのみです。ほとんどのバージョンは効果がありません

    $(".spanOne").live('click', function() {
        console.log("我是一个标签");
        $("#spanArray").append('<br><span class="spanOne">我是新生成的标签,点击我此时有效果</span><br>')

    })
        <script>

$( "")。click(fun(){})と$(document).on( 'click'、 ''、fun(){})の違いと

click()とonclick()の違いについては、次の記事を参照してください。

https://blog.csdn.net/zhang19903848257/article/details/104016894

おすすめ

転載: blog.csdn.net/zhang19903848257/article/details/104016818
おすすめ