JQuery load() 使 Jquery 函数多次触发答案

【问题标题】：JQuery load() make Jquery functions fires multiple timesJQuery load() 使 Jquery 函数多次触发
【发布时间】：2016-05-23 03:58:00
【问题描述】：

这是我的代码。它加载页面内容而不刷新。

问题是当我单击由 jQuery 和 ajax 处理的按钮时，它会触发与加载页面一样多的次数。

例如如果加载 2 个页面，jQuery 将触发两次

如果我加载了 4 个页面，jQuery 将加载 4 次。

 <script>
        $(document).ready(function(){
            //set trigger and container

            var trigger = $('#nav ul li a'),
                container = $('#container');
            //do on click


            trigger.on('click', function(e){
                /***********/
                 e.preventDefault();

               /* reload content without refresh */
                //set loading img
                $('#container').append('<div id = "loading">WAIT...  <img src = "img/ajax-loader-small.gif" alt="Currently loading"   /></div>');
                //change img location to center
                $("#loading").css({"position": "absolute", "left": "50%", "top": "50%"});
                //get the  trigger to reload the contents
                var $this = $(this),
                    target = $this.data('target');

                container.load(target + '.php');

              //  return false;
                $(trigger).die('click');
            });
        });

这个脚本触发的次数与我通过 load() 函数加载页面的次数一样多，这意味着同一篇文章将被多次插入数据库中

<script>

    $(document).ready(function(){


    $(document).on("click",".fa-pinterest-square",function(e) {


        var form = $(this).find('form'); //Since the form is child to <i>

        $.ajax({
            url: "includes/widgets/add_pains.php",
            type: "POST",
            data: form.serialize(),
            success: function(data) {
                alert(data);

            }
        });

    });
    });

</script>

我该如何解决这个问题？

【问题讨论】：

你的问题不是很清楚。就目前而言，您的代码不会触发 anything 多次。它真的很简单。你有没有留下任何代码？如果是，请在此处发布。
谢谢，不过我差点把网站上的所有东西都删了，还是没解决，就是第二个脚本的问题。

标签： javascript php jquery ajax

【解决方案1】：

请用它来解决你的问题

    trigger.unbind().click(function()

         //code 
   });

【讨论】：

【解决方案2】：

发生这种情况是因为您没有在每次加载脚本时清除事件侦听器，并且事件侦听器相互堆叠导致多次触发。

trigger.off('click').on('click', function(){....})

.off() 方法会删除使用 .on() 附加的事件处理程序。

【讨论】：

谢谢，还是没解决问题，还是会触发多次。
@jack，你也关闭了 $(document).on("click",".fa-pinterest-square") 吗？
是的，我做了“$(document).off('click').on("click",".fa-pinterest-square",function(e) .." 但它没有也不行。感谢您的帮助
我把它改成了 $(document).off("click",".fa-pinterest-square").on("click",".fa-pinterest-square",function( e)，但问题依然存在！

【解决方案3】：

我通过在 index.php 中插入脚本解决了这个问题，可能由于包含主页而被多次调用。

【讨论】：