Пустые селектора jQuery, нарушающие остальную часть скрипта

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

Нет, вам не нужно, чтобы проверить empty или undefined в jquery, это implicitly сделано jquery.

также вы можете переписать код, как показано ниже, меньше кода лучше производительность

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

Answer 2

Я не знаю, если это проблема, но вы не заявляющие обработчиков событий щелчка правильно:

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

Если поставить скобки, то функция вызываются непосредственно.

Должно быть:

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

Насколько я знаю, JQuery всегда возвращается, если нет DOM элемент не был подобран он просто не содержит ни одного элемента (длина = 0).