jquery - 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('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();
       });
    });

Answer 2

$(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();
        });
    }
});