JQuery append error message once

Question

У меня есть поле поиска, и когда он оставлен пустым и нажата кнопка «Поиск», появляется сообщение об ошибке «Пожалуйста, введите поисковый запрос». Это то, что я хочу, но если вы снова нажмете его, сообщение будет добавлено снова и снова. Я хочу, чтобы он просто добавлялся один раз.

Это то, что JQuery выглядит следующим образом:

$('#search').find('input[type=submit]').click(function(){ 
    if(! $('input[name=keywords]').val()){ 
     $('#search input[name=keywords]').addClass('error'); 
     $("#search").append("<p class='errorMsg top'>Please enter a search term</p>"); 
     //alert('Please enter a search term'); 
     return false; 
    } else { 
     _gaq.push(['_trackEvent', 'onsite_search', $('input[name=keywords]').val()]); 
    } 

}); 

Я попытался добавить это перед, если заявление:

for i=0; i<1; i++ 

Это полностью перевернул функциональность прочь. Я также попытался добавить

.one('click', function{ 
}) 

Этот вид работал - это позволило вам нажать на строку поиска, пока он пуст, дал сообщение об ошибке, но на второй клик, обработав результаты поиска в виде «».

Любая помощь была бы высоко оценена!

Кроме того, я не думаю, что это действительно имеет значение, но вот HTML:

<fieldset class="fieldset"> 
<legend>{lang:search_by_keyword}</legend> 

<input type="text" class="input" maxlength="100" size="40" name="keywords" style="width:100%;" /> 

<div class="default"> 
<select name="search_in"> 
<option value="titles" selected="selected">{lang:search_in_titles}</option> 
<option value="entries">{lang:search_in_entries}</option> 
<option value="everywhere" >{lang:search_everywhere}</option> 
</select> 

</div> 

Answer 1

Что о том, переменную, которая проверяет, является ли пользователь уже предупредил? Затем вы просто добавляете сообщение об ошибке, если он уже не был предупрежден.

var alerted = false; 

$('#search').find('input[type=submit]').click(function(){ 

    if(! $('input[name=keywords]').val() && ! alerted){ 

     alerted = true; 
     $('#search input[name=keywords]').addClass('error'); 
     $("#search").append("<p class='errorMsg top'>Please enter a search term</p>"); 
     //alert('Please enter a search term'); 
     return false; 
    } else { 
     alerted = false; //alternatively, check if a <p> tag with class errorMsg exists and then set alerted = false 
     _gaq.push(['_trackEvent', 'onsite_search', $('input[name=keywords]').val()]); 
    } 

}); 

Answer 2

Использование .html вместо .append при проводке сообщение об ошибке