可以找出什么干扰了之前运行良好的jquery代码?

时间:2012-06-18 11:52:11

标签: javascript jquery debugging

我在Wordpress的头文件的标题中有一些基本的jquery代码。它一直工作,直到客户我交给它添加了几个插件,如果可能的话我宁愿不关闭,因为这可能会导致问题。

我正在尝试确定是否有一种简单的方法可以解决可能干扰代码的问题(作为一个相对较新的javascript开发人员,我仍然习惯于控制台)。 解决方案不仅适用于此案例,而且适用于任何其他类似情况也很棒!

当我说它不起作用时,它只显示应隐藏的所有div(根据代码)。控制台中没有出现错误。

该网站的代码如下:

<script type="text/javascript">
$(document).ready(function(){
    $("ul.tabs").tabs("div.panes", {tabs:'li'});
    });

</script>

我之前在基本的HTML文件中对此进行了测试,它运行正常;

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Untitled Document</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="http://cdn.jquerytools.org/1.2.7/full/jquery.tools.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
    $("ul.tabs").tabs("div.panes", {tabs:'li'});
    });
</script>
</head>
<body>
<div class="tab_nav">
    <ul class="tabs">
        <li><a href="#">Most Recent</a></li>
        <li><a href="#">Most Viewed</a></li>
        <li><a href="#">Most Comments</a></li>
    </ul>
    <div class="clear"></div>
</div>
<div class="tab_content panes">
CONTENT ONE
</div>
<div class="tab_content panes">
CONTENT TWO
</div>
<div class="tab_content panes">
CONTENT THREE
</div>
</body>
</html>

3 个答案:

答案 0 :(得分:3)

首先在无冲突模式下尝试JQuery。

http://api.jquery.com/jQuery.noConflict/

(您必须使用jQuery代替$) 并看看它是否有效。

答案 1 :(得分:0)

删除插件,然后一次重新添加一个插件,直到问题再次出现。

答案 2 :(得分:0)

某些Jquery文件(可能来自添加的插件)可能与您的代码冲突。尝试注释掉WP插件中包含的一些jquery文件。它通常有助于从一个干净的平板开始,然后逐个添加文件,这样你就会发现哪一个导致问题。