有没有办法在页面上有两个javascript脚本而不会发生冲突并跳过其中一个脚本?
如果是这样的话?
我正在尝试使用下面的小提琴,但转换不起作用,我相信这是因为我在同一页面上有下面的javascript。也许我错了
<script>
var bgArr = [
'images/bg1.jpg',
'images/bg2.jpg',
'images/bg3.jpg',
'images/bg4.jpg',
'images/bg5.jpg',
'images/bg6.jpg',
'images/bg7.jpg',
'images/bg8.jpg',
'images/bg9.jpg',
'images/bg10.jpg'];
document.body.style.backgroundImage = 'url(' + bgArr[10] + ')';
bgCur = 0;
backgroundSwitch = function () {
if (bgCur == bgArr.length) bgCur = 0;
document.body.style.backgroundImage = 'url(' + bgArr[bgCur++] + ')';
}
window.setInterval(backgroundSwitch, 6000); // Switch every 6 seconds.
</script>
答案 0 :(得分:0)
您的网页上有两个<script>
元素。第一个动画侧边栏并需要jQuery。第二个设置背景图像的旋转,但不需要jQuery。
第一个<script>
元素中的代码导致抛出Uncaught ReferenceError: $ is not defined
错误并退出执行。浏览器仍在第二个<script>
元素中执行代码,因此看起来第一个<script>
被跳过。
您需要包含jQuery库。您可以从自己的服务器上提供服务,也可以使用以下内容:
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js" ></script>
您还需要将侧边栏的代码放在文档就绪处理程序中:
$(document).ready(function() {
$("div.leftContainer")
.css("margin-left",-$(this).width())
.animate({
marginLeft:0
}, 1000);
});
否则浏览器将尝试在它引用的元素存在之前执行它。
注意:jsfiddle设置为在页面加载时执行代码,因此它不需要包含在文档就绪处理程序中的代码。