Question

我不知道为什么以及怎么做，但我的jQuery代码似乎在任何事件上都会被解雇两次。

这是我的代码的一部分：

commmon.js：

$(document).ready(function() {

    $(".fpbtn-one").click(function() {
        console.log("Click recorded!"); // Gets logged twice on click
        $(this).parent().next().slideToggle();
    });

    // The rest of the code...

});

$(window).load(function() {

    console.log("Setting up slides"); // Gets logged 2 on page load

    // These get initialized twice
    $("#div-1").responsiveSlides({
        auto: true,
        pager: true,
        pause:true,
        nav: false,
        timeout: 3000,
        speed: 500,
        maxwidth: 482,
        namespace: "transparent-btns"
    });

    $("#div-2").responsiveSlides({
        auto: true,
        pager: false,
        pause:true,
        nav: false,
        speed: 2000,
        maxwidth: 320,
    });

});

HTML：

<!doctype html>
<html lang="en">
<head><link href="/assets/css/jquery.qtip.css" rel="stylesheet" type="text/css" />
<link href="/assets/custom/themes/1st-formation-theme/theme.css" rel="stylesheet" type="text/css"/>
<link href="/assets/css/efControl.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.9.0/jquery-ui.min.js"></script>
<script type="text/javascript" src="/assets/script/jquery/jquery.qtip.js"></script>
<script type="text/javascript" src="/assets/script/jquery/plugin.efiling.full.js"></script>

<meta charset="utf-8" /><script type="text/javascript">window.NREUM||(NREUM={}),__nr_require=function a(b,c,d){function e(f){if(!c[f]){var g=c[f]={exports:{}};b[f][0].call(g.exports,function(a){var c=b[f][1][a];return e(c?c:a)},g,g.exports,a,b,c,d)}return c[f].exports}for(var f=0;f<d.length;f++)e(d[f]);return e}({"4O2Y62":[function(a,b){function c(a,b){var c=d[a];return c?c.apply(this,b):(e[a]||(e[a]=[]),void e[a].push(b))}var d={},e={};b.exports=c,c.queues=e,c.handlers=d},{}],handle:[function(a,b){b.exports=a("4O2Y62")},{}],YLUGVp:[function(a,b){function c(){var a=m.info=NREUM.info;if(a&&a.agent&&a.licenseKey&&a.applicationID){m.proto="https"===l.split(":")[0]||a.sslForHttp?"https://":"http://",g("mark",["onload",f()]);var b=i.createElement("script");b.src=m.proto+a.agent,i.body.appendChild(b)}}function d(){"complete"===i.readyState&&e()}function e(){g("mark",["domContent",f()])}function f(){return(new Date).getTime()}var g=a("handle"),h=window,i=h.document,j="addEventListener",k="attachEvent",l=(""+location).split("?")[0],m=b.exports={offset:f(),origin:l,features:[]};i[j]?(i[j]("DOMContentLoaded",e,!1),h[j]("load",c,!1)):(i[k]("onreadystatechange",d),h[k]("onload",c)),g("mark",["firstbyte",f()])},{handle:"4O2Y62"}],loader:[function(a,b){b.exports=a("YLUGVp")},{}]},{},["YLUGVp"]);</script>
<meta content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" name="viewport" />


<link href="/assets/custom/files/favicon.ico" rel="shortcut icon" />
<link href="/assets/custom/images/system/apple-touch-icon.png" rel="apple-touch-icon" />
<link href="/assets/custom/images/system/apple-touch-icon-72x72.png" rel="apple-touch-icon" sizes="72x72" />
<link href="/assets/custom/images/system/apple-touch-icon-114x114.png" rel="apple-touch-icon" sizes="114x114" />

<meta content="" name="description" />
<meta content="" name="keywords" />
<meta content="NOINDEX, NOFOLLOW" name="ROBOTS" />
<title>Some title</title>


<link href="/assets/custom/files/css/reset.css" rel="stylesheet" type="text/css" />
<link href="/assets/custom/files/css/base.css?=v1" rel="stylesheet" type="text/css" />
<link href="/assets/custom/files/css/font-awesome.css" rel="stylesheet" type="text/css" />
<!--[if IE 7]>
<link rel="stylesheet" href="/assets/custom/files/css/font-awesome-ie7_min.css">
<![endif]-->
<script type="text/javascript" src="/assets/custom/files/js/adobe-type.js"></script>
</head>
<body>

<!-- BODY STUFF IN HERE (REMOVED) -->

<script type="text/javascript" src="/assets/custom/files/js/jquery-mmenu-min.js"></script>
<script type="text/javascript" src="/assets/custom/files/js/jquery-anystretch-stand-min.js"></script>
<script type="text/javascript" src="/assets/custom/files/js/common.js"></script>
<script type="text/javascript" src="/assets/custom/files/js/modernizr.js"></script>
<script type="text/javascript" src="/assets/custom/files/js/responsiveslides_min.js"></script>
<script type="text/javascript" src="/assets/custom/files/js/socialmedia.js"></script>
<script type="text/javascript" src="/assets/custom/files/js/jquery_atooltip_min.js"></script></div>

<script type="text/javascript">window.NREUM||(NREUM={});NREUM.info={"beacon":"beacon-4.newrelic.com","licenseKey":"204ccc8db2","applicationID":"1825150","transactionName":"YVNVYBACWxFTWxFcWVgZYkYLTFwMVl0dG0ZeRg==","queueTime":0,"applicationTime":187,"ttGuid":"","agentToken":"","userAttributes":"","errorBeacon":"jserror.newrelic.com","agent":"js-agent.newrelic.com\/nr-361.min.js"}</script></body>
</html>

可能是什么原因？

Answer 1

你的代码是否正在操纵代码加载的元素？

这个答案可能就是它发生的原因：

jQuery $(document).ready () fires twice

Answer 2

尝试将内容放入div中的正文中。

例子。 <div id = "menu"><script type="text/javascript" src="/assets/custom/files/js/jquery-mmenu-min.js"></script> </div>

我希望有效。：）

Answer 3

在调用jquery时要小心开始使用好的做法：

!function( $ ) {
   your code

}( jQuery )

就像你避免冲突一样......

然后在html中添加js脚本时要小心，你可以添加两次，例如你在一个html文件中调用一个js，ok但是你在js中加载回调例如另一个页面里面有js，它会调用两次你的代码....我在使用递归调用之前有同样的问题，js永远不会停止调用它！在主页面中，最好是在几个文件中调用你的js，否则你必须调试它....

此外，您不会粘贴我们可以帮助您的所有代码，我们可以在我看来告诉您......通常不是一个好建议......

Answer 4

可能您已经两次包含了脚本文件commmon.js。在代码中检查对它的引用。

Answer 5

可能是事件冒泡。使用event.preventDefault()，它会阻止发生默认事件，或event.stopPropagation()会阻止事件冒泡。

$(document).ready(function() {

    $(".fpbtn-one").click(function(event) {
        event.stopPropagation();
        console.log("Click recorded!"); // Gets logged twice on click
        $(this).parent().next().slideToggle();
    });

    // The rest of the code...

});

Answer 6

最简单的解释是你错误地将common.js包含了两次。

查看各个脚本，看看你是否在主文件的顶部引用了common.js.

Answer 7

您的相关代码是必需的，但是来自上面的代码段;尝试将所有代码放入文档就绪方法中。

jQuery代码触发两次

7 个答案: