Question

我网站的每个页面都有一组不同的jQuery效果以及使用ajax提交的表单。我遇到一个问题，一个空的jQuery选择器阻止其余的javascript运行。例如：

// site.js
$(document).ready(function() {

function changeText() {
$("#div1").html("Test 1");
$("#div2").html("Test 2");
}

$("#button1").click(changeText());
$("#button2").click(changeText());

});

// page1.html
<script src="/static/jquery.js"></script>
<script src="/static/site.js"></script>
<div id="div1">Div 1</div>
<input type="button" value="Change" id="button1"> <!-- Works //-->

// page2.html
<script src="/static/jquery.js"></script>
<script src="/static/site.js"></script>
<div id="div2">Div 2</div>
<input type="button" value="Change" id="button2"> <!-- Doesn't work //-->

到目前为止，我的解决方案是为每个页面创建单独的javascript文件，但必须有另一种方法。有任何想法吗？我是否真的需要在if $("selector").length调用中包装每个选择器，以便脚本不会中断？

Answer 1

我不知道是不是问题，但您没有正确声明您的点击事件处理程序：

$("#button1").click(changeText());

如果放括号，则直接调用该函数。

应该是：

$("#button1").click(changeText);

据我所知，jQuery总是返回，如果没有匹配的DOM元素，它只包含没有元素（length = 0）。

Answer 2

不，您不需要在empty中检查undefined或jquery，implicitly完成jquery。

你也可以重写下面的代码，更少的代码更好的性能

$("#button1,#button1").click(function(){
   $("#div1").html("Test 1");
   $("#div2").html("Test 2");
});

空的jQuery选择器打破了脚本的其余部分

2 个答案: