jQuery代码在测试中工作,但不是在现场
jQuery code working in testing but not on site
所以我有以下代码:
<script src="http://jamesleist.com/wp-content/uploads/2013/01/js/jquery-1.7.2.min.js" type="text/javascript"></script>
<script>
$(document).ready(function() {
$('.me').hide();
$('.clickme').click(function() {
$(this).next('.me').animate({
height: 'toggle'
}, 500);
});
});
</script>
<div class="clickme" style="background-color: #333333; color: #FFFFFF; padding: 10px; width: 200px; cursor:pointer;">
Click here to toggle me in and out =)
</div>
<img class="me" src="http://www.randomsnippets.com/wp-content/uploads/2011/04/2.png" alt="It's me....ah!!!" title="Allen Liu" width="100" height="77" class="alignnone size-full wp-image-552" style="border: none;" />
<div class="clickme" style="background-color: #333333; color: #FFFFFF; padding: 10px; width: 200px; cursor:pointer;">
Click here to toggle me in and out =)
</div>
<img class="me" src="http://www.randomsnippets.com/wp-content/uploads/2011/04/2.png" alt="It's me....ah!!!" title="Allen Liu" width="100" height="77" class="alignnone size-full wp-image-552" style="border: none;" />
它在自己运行时工作得很好,但是当我将其实现到主站点时,它不起作用。
您可以在下面的URL中看到我在哪里尝试实现它。
http://jamesleist.com/portfolio
这真的让我很困惑:-(顺便说一下,我正在使用Wordpress和jQuery链接到header.php文件。
我假设这是Wordpress的问题?
非常感谢您的帮助。
.me
不是下一个元素,下一个元素是包含图像的段落?
$(document).ready(function() {
$('.me').hide();
$('.clickme').on('click', function() {
$(this).next('p').find('.me').animate({
height: 'toggle'
}, 500);
});
});
您的img
标签定义了两个class
属性。我不确定这是否是100%的原因,但这绝对应该修复。
:
<img class="me alignnone size-full wp-image-552" src="http://www.randomsnippets.com/wp-content/uploads/2011/04/2.png" alt="It's me....ah!!!" title="Allen Liu" width="100" height="77" style="border: none;" />
你的图像有'class'定义两次,你不能这样做。你需要把所有的类包括'me'类都包含在一个用空格分隔的类声明中。简单地运行一个验证器就可以清楚地显示错误。
我还会考虑将内部和外部脚本移动到页面的底部,以便dom不会等待它们加载。将所有的内联样式移到样式表中也是一个好主意,这样您的代码更容易阅读和调试。
相关文章:
- Javascript:selenium Web驱动程序isDisplayed()不工作
- jQuery UI自动完成突然停止工作
- AngularJS UI路由器不能像ng路由器那样工作
- HTML5音频加载和播放获胜'我不能在iPad上工作
- JavaScript打印功能使日历停止工作
- Javascript setInterval在localhost上工作,但确实'Don’我不在现场工作
- 谷歌地图在本地工作,但当我搬到现场时,它显示空页面
- flexislider无法在现场工作,图像没有旋转,但导航点正在改变
- Highcharts在jsfiddle上工作,但在现场失败
- Vanilla Javascript函数在JsFiddle上工作,但不在现场工作
- 现场的 HTML 5 音频控件无法正常工作
- MongoDB / mongab Remove请求在本地工作,但在现场时删除数据库
- JavaScript工作在小提琴,但不是在现场
- 为什么我的javascript在现场停止工作,但在测试环境中工作得很好
- Fancybox打开问题-在JSFiddle上工作,但不能在现场环境中工作
- 现场Javascript不能在Electron中工作,但可以在其他任何地方工作
- jQuery代码在测试中工作,但不是在现场
- Fancybox不在现场工作,但在本地工作
- 代码不在 JSFiddle 中运行,但在现场工作
- OnClick操作不会't不能同时工作,但只能用于第一次装载.包括现场示例