我为我的主页制作了一个小按钮显示隐藏代码。如果我将该代码放在内部页面中它可以正常工作,但如果我把它放在主页上它就不起作用。如果我将Jquery CDN放入标题中,那么我的旋转滑块就会停止工作。
在我的主页部分,您可以看到代码:
http://www.mythstreet.com/#our-services
这是我的小提琴,工作得很好:
http://jsfiddle.net/junaidkhawaja/ha6qp7w4/6/
以下是我的代码片段: 的 HTML
<div id="1">
My Content 1
</div>
<div id="2" style="display:none;">
My Dynamic Content
</div>
<div id="static" style="display:none;">
My Static Content
</div>
<button id="btnClick">Click me!</button>
<hr />
<div id="3">
My Content 1
</div>
<div id="4" style="display:none">
My Dynamic Content
</div>
<div id="static2" style="display:none;">
My Static Content
</div>
<button id="btnClick2">Click me!</button>
使用Javascript:
$( document ).ready(function() {
$('#btnClick').on('click',function(){
if($('#1').css('display')!='none'){
$('#2').html($('#static').html()).show().siblings('#1').hide();
}else if($('#2').css('display')!='none'){
$('#1').show().siblings('#2').hide();
}
});
$('#btnClick2').on('click',function(){
if($('#3').css('display')!='none'){
$('#4').html($('#static2').html()).show().siblings('#3').hide();
}else if($('#4').css('display')!='none'){
$('#3').show().siblings('#4').hide();
}
});
});
更新:我发现在使用此代码后,我的滑块也无效。
答案 0 :(得分:1)
只需查看您的网站并在控制台中玩游戏,我就可以看到$未定义。
快速解决此问题的方法是将代码更改为使用jQuery()
代替$(...)
注意:目前无法进一步调试,因为您已修复了现场网站上的代码(万岁!)
答案 1 :(得分:0)
查看代码,在第一行您会错过$
这一个:
$( document ).ready(function()
应该是:
jQuery( document ).ready(function($)