Question

我写了一个简单的函数：

if ( some "charCode" is entered into <input> ) {
// display warning message
}

问题是如果反复输入禁用的charCode，也会重复插入消息。我需要它只显示一次，所以我嵌套了另一个“if”：

  if ( some "charCode" is entered into <input> ) {
                  if (warning does not exist in the DOM) {
                     // insert the message
              } else {
                    //remove message and re-insert
          }
    }

以下是失败的代码：

    $(document).ready(function () {

    $('input').keypress(function (key) {
        var Warning = '<div class="exerciseWarning"><p>Warning msg</p></div>';
        if (key.charCode === 46 || key.charCode === 44) {
            if (Warning.length !== 0) {
                $('input').after(Warning);
                return false;

            } else {
                Warning.remove();
                $('input').after(Warning);
            }
        }
    }); // end of keypress()

    //last bracket
});

这里的小提琴 - ＆gt; Fiddle

Answer 1

您正在检查永远不会为0的字符串文字Warning的长度。相反，您可以检查当前输入元素的下一个兄弟是否为exerciseWarning元素，如下所示

尝试

$(document).ready(function () {

    var Warning = '<div class="exerciseWarning"><p>Warning msg</p></div>';
    $('input').keypress(function (key) {
        if (key.charCode === 46 || key.charCode === 44) {
            var $this = $(this);
            if (!$this.next().is('.exerciseWarning')) {
                $('input').after(Warning);
                return false;
            }
        }
    }); // end of keypress()

    //last bracket
});

演示：Fiddle

Answer 2

    $(document).ready(function () {

        $('input').keypress(function (key) {
            var Warning = '<div class="exerciseWarning"><p>Warning msg</p></div>';
            if (key.charCode === 46 || key.charCode === 44) {
                if ($('.exerciseWarning').length <= 0) {
                    $('input').after(Warning);
                    return false;

                } else {
                   // $('.exerciseWarning').remove();
                    //$('input').after(Warning);
                }
            }
        }); // end of keypress()

        //last bracket
    });

    // var stupidPunctuation = ['.',':'] ;

按键（）后只插入一次消息

2 个答案: