我在 my website 上安装了一些 jQuery 组件、一个 Bootstrap 下拉菜单、一个横幅 slider 和一个内容 slider 。
目前下拉菜单不起作用,而横幅 slider 和内容 slider 可以正常工作。 我试图从内容 slider 禁用 jQuery 链接(这使下拉菜单恢复工作),所以我知道它们存在冲突。
jQuery 下拉菜单位于此处:
<script src="http://www.helpmyedu.com/wp-content/themes/parallelus-moxie/assets/js/jquery.js"></script>
内容 slider jQuery 位于此处:
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
如何将它们结合起来?
谢谢
=======更新===================================== =============
我出于某种原因删除了这一行:
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
一切正常......
谢谢大家!
最佳答案
我认为您不需要调用相同的脚本。
<script src="http://www.helpmyedu.com/wp-content/themes/parallelus-moxie/assets/js/jquery.js"></script>
/*! jQuery v1.10.2 | (c) 2005, 2013 jQuery Foundation, Inc. | jquery.org/license
//@ sourceMappingURL=jquery-1.10.2.min.map
*/
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
/*! jQuery v1.10.2 | (c) 2005, 2013 jQuery Foundation, Inc. | jquery.org/license
//@ sourceMappingURL=jquery.min.map
*/
它们的来源不同,但都是 jQuery v1.10.2。只需使用一个并将其放在您正在使用的其他 javascript 之上。
注意:我的回答基于:
Currently the dropdown menu doesn't work while the banner slider & content slider works fine. I have tried to disable the jQuery link from the content slider (which made the dropdown menu back to work), so I know they're conflicting.
根据上面提供的源 url,您的标记中有这样的内容:
<!-- jQuery #1 --><script src="http://www.helpmyedu.com/wp-content/themes/parallelus-moxie/assets/js/jquery.js"></script>
<script src="http://www.helpmyedu.com/wp-content/themes/parallelus-moxie/assets/js/twitter-bootstrap-hover-dropdown.js"></script>
<script>
// very simple to use!
$(document).ready(function() {
$('.js-activated').dropdownHover().dropdown();
});
</script>
<!-- CSS Embedded Here.. -->
<!-- jQuery #2 --><script type='text/javascript' src='http://www.helpmyedu.com/wp-includes/js/jquery/jquery.js?ver=1.10.2'></script>
<script type='text/javascript' src='http://www.helpmyedu.com/wp-includes/js/jquery/jquery-migrate.min.js?ver=1.2.1'></script>
<script type='text/javascript' src='http://www.helpmyedu.com/wp-content/plugins/alligator-popup/js/popup.js?ver=1.0.0'></script>
<script type='text/javascript' src='http://www.helpmyedu.com/wp-content/plugins/iphorm-form-builder/js/iphorm.js?ver=1.4.4'></script>
<script type='text/javascript' src='http://www.helpmyedu.com/wp-includes/js/swfupload/swfupload.js?ver=2201-20110113'></script>
<script type='text/javascript' src='http://www.helpmyedu.com/wp-includes/js/swfobject.js?ver=2.2-20120417'></script>
<script type='text/javascript' src='http://www.helpmyedu.com/wp-includes/js/swfupload/plugins/swfupload.swfobject.js?ver=2201a'></script>
<script type='text/javascript' src='http://www.helpmyedu.com/wp-includes/js/swfupload/plugins/swfupload.queue.js?ver=2201'></script>
<script type='text/javascript' src='http://www.helpmyedu.com/wp-content/plugins/revslider/rs-plugin/js/jquery.themepunch.plugins.min.js?ver=3.7.1'></script>
<script type='text/javascript' src='http://www.helpmyedu.com/wp-content/plugins/revslider/rs-plugin/js/jquery.themepunch.revolution.min.js?ver=3.7.1'></script>
<script type='text/javascript' src='http://www.helpmyedu.com/wp-content/themes/parallelus-moxie/assets/js/modernizr-2.6.2-respond-1.1.0.min.js?ver=2.6.2'></script>
我认为您必须删除 jQuery#1 并将其他 2 个脚本与下面的其他脚本一起移动,如下所示:
<!-- CSS Embedded Here.. -->
<!-- jQuery #2 --><script type='text/javascript' src='http://www.helpmyedu.com/wp-includes/js/jquery/jquery.js?ver=1.10.2'></script>
<script src="http://www.helpmyedu.com/wp-content/themes/parallelus-moxie/assets/js/twitter-bootstrap-hover-dropdown.js"></script>
<script>
// very simple to use!
$(document).ready(function() {
$('.js-activated').dropdownHover().dropdown();
});
</script>
<script type='text/javascript' src='http://www.helpmyedu.com/wp-includes/js/jquery/jquery-migrate.min.js?ver=1.2.1'></script>
<script type='text/javascript' src='http://www.helpmyedu.com/wp-content/plugins/alligator-popup/js/popup.js?ver=1.0.0'></script>
<script type='text/javascript' src='http://www.helpmyedu.com/wp-content/plugins/iphorm-form-builder/js/iphorm.js?ver=1.4.4'></script>
<script type='text/javascript' src='http://www.helpmyedu.com/wp-includes/js/swfupload/swfupload.js?ver=2201-20110113'></script>
<script type='text/javascript' src='http://www.helpmyedu.com/wp-includes/js/swfobject.js?ver=2.2-20120417'></script>
<script type='text/javascript' src='http://www.helpmyedu.com/wp-includes/js/swfupload/plugins/swfupload.swfobject.js?ver=2201a'></script>
<script type='text/javascript' src='http://www.helpmyedu.com/wp-includes/js/swfupload/plugins/swfupload.queue.js?ver=2201'></script>
<script type='text/javascript' src='http://www.helpmyedu.com/wp-content/plugins/revslider/rs-plugin/js/jquery.themepunch.plugins.min.js?ver=3.7.1'></script>
<script type='text/javascript' src='http://www.helpmyedu.com/wp-content/plugins/revslider/rs-plugin/js/jquery.themepunch.revolution.min.js?ver=3.7.1'></script>
<script type='text/javascript' src='http://www.helpmyedu.com/wp-content/themes/parallelus-moxie/assets/js/modernizr-2.6.2-respond-1.1.0.min.js?ver=2.6.2'></script>
关于javascript - Bootstrap 下拉菜单 jQuery 与其他库冲突?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19919014/