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

This is my code. It loads the pages content without refresh.

The problem is when I click on button handled by jQuery and ajax it fires as many times as I load the pages.

For e.g. If loaded 2 pages, jQuery will fire twice

If I loaded 4 pages, jQuery will load 4 times.

 <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');
            });
        });

This script fires as many times as I load the page through load() function which mean same post will be inserted many times into the database

<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>

How can I fix this issue?

dqcz57269
dqcz57269 谢谢,但我几乎从网站上删除了一切,但它没有解决它,这意味着第二个脚本中的问题。
4 年多之前 回复
dongzhao2725
dongzhao2725 你的问题不是很清楚。您的代码目前不会多次触发任何内容。它真的很简单。你要留下任何代码吗?如果是这样,请在此处发布。
4 年多之前 回复

3个回答



发生这种情况是因为每次加载脚本时都没有清除事件监听器,并且事件监听器彼此堆叠导致触发多次 时间。</ p>

  trigger.off('click')。on('click',function(){....})
</ code> </ pre >

.off()方法删除附加的事件处理程序。 on()。</ p>
</ div>

展开原文

原文

This happened because you didn't clear the event listener each time you load the script and the event listener stacked on each other caused trigger multiple times.

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

The .off() method removes event handlers that were attached with .on().

duanlinpi0265
duanlinpi0265 我将其更改为$(document).off(“click”,“。fa-pinterest-square”)。on(“click”,“。fa-pinterest-square”,函数(e),但问题仍然存在 !
4 年多之前 回复
duanhangjian8149
duanhangjian8149 请尝试:$(document).off(“click”,“。fa-pinterest-square”)。on(......)
4 年多之前 回复
dongyou6795
dongyou6795 是的我做了“$(文件).off('点击')。on(”点击“,”。fa-pinterest-square“,函数(e)..”但它没有用。感谢你的 救命
4 年多之前 回复
dongyi0114
dongyi0114 你有没有关闭$(文件).on(“点击”,“。fa-pinterest-square”)?
4 年多之前 回复
doufei5537
doufei5537 谢谢,但它没有解决问题,它仍然多次发生火灾。
4 年多之前 回复



请使用它来解决您的问题</ p>

  trigger.unbind()。 单击(函数()

//代码
});
</ code> </ pre>
</ div>

展开原文

原文

Please use this it will solve your problem

    trigger.unbind().click(function()

         //code 
   });

duanmi8349
duanmi8349 谢谢,但它也没有用
4 年多之前 回复



我通过在index.php中插入脚本来解决问题,可能是因为包含主页而被多次调用。</ p>
</ div>

展开原文

原文

I fixed the problem by inserting the script in index.php, maybe it was called several time due to include the home page.

Csdn user default icon
上传中...
上传图片
插入图片
抄袭、复制答案,以达到刷声望分或其他目的的行为,在CSDN问答是严格禁止的,一经发现立刻封号。是时候展现真正的技术了!
立即提问
相关内容推荐