jQuery添加而不是提醒消息

Question

我想显示一条消息到一个div而不是提醒它，然后将它隐藏起来click/blur 由于打字错误，警报弹出。我需要显示一个消息到一个div而不是一个警报。

喜欢的东西：

$('form.form-calculator input').on('change click', function() { 
     if ($(this).val() == 0) { 
      var div = $("#AlertMessage"); 
      div = $("<div id='AlertMessage' onclick='$(this).hide();'></div>"); 
      $("body").prepend(div); 
      this.value=0; 
     } 
     calc_total(); 
    }); 

与警报

$(function() { 
     $('.form input').on('change click focus', function() { 
      if ($(this).val() == 0) { 
      alert('HELLO'); 
      this.value = 0; 
      } 
      calc_total(); 
     }); 
    }); 

Answer 1

$(function() { 
    $('.form input').on('focusout', function() { 
     if ($(this).val() == 0) { 
      showError('Hello'); 
     } else { 
      $("#AlertMessage").remove(); 
     } 
     calc_total(); 
    }); 

    function showError(text) { 
     $("#AlertMessage").remove(); 
     $('<div/>', { 
      id: 'AlertMessage', 
      text: "Alert! It can't be 0" 
     }).prependTo('body'); 
     // Close on click 
     $('body').delegate('#AlertMessage', 'click', function() { 
      $(this).hide(); 
     }); 
    } 
}); 

Answer 2

假设你的代码工作的两件（因为你没有要求解决那些），你可以将这些合并为一个像这样的：

$(function() { 
     $('.form input').on('change click focus', function() { 
      if ($(this).val() == 0) { 
      div = $("<div id='AlertMessage' onclick='$(this).hide();'>HELLO</div>"); 
      $("body").prepend(div); 
      this.value = 0; 
      } 
      calc_total(); 
     }); 
    });