jQuery代码在测试中工作,但不是在现场

jQuery code working in testing but not on site

本文关键字:现场 工作 代码 测试 jQuery      更新时间:2023-09-26

所以我有以下代码:

<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&#039;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&#039;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&#039;s me....ah!!!" title="Allen Liu" width="100" height="77" style="border: none;" />

你的图像有'class'定义两次,你不能这样做。你需要把所有的类包括'me'类都包含在一个用空格分隔的类声明中。简单地运行一个验证器就可以清楚地显示错误。

我还会考虑将内部和外部脚本移动到页面的底部,以便dom不会等待它们加载。将所有的内联样式移到样式表中也是一个好主意,这样您的代码更容易阅读和调试。