在Javascript中提醒一次

Question

我在HTML表单中有两个文本输入字段，我想使用JavaScript进行所需的验证。如果在第一个文本输入字段为空或空白时第二个文本字段中有输入，我的JavaScript应该提醒＆＃34;请先输入text1。＆＃34;

但是，警告框总是弹出不止一次，用户可能会发现它很烦人。首先，当我在 text2 中键入内容时。其次，当我点击 text1 输入内容时。有没有办法让警报框只显示一次，可能只在第一种情况下显示？

<script>
$("#text2").on("change",function(){ 
var t1 = document.getElementById("text1").value;
if (t1 == "")
alert("Please enter text1 first.");
});
</script>

Answer 1

使用jQuery的.one()函数，而不是.on()

<script>
    $("#text2").one("change", function (event) { 
        var t1 = document.getElementById("text1").value;

        if (t1 === "") {
            alert("Please enter text1 first.");
        }
    }
</script>

Answer 2

这里有一点用户体验答案，但是......

用户会发现任何数量的警报令人讨厌（零除外）。

当呈现多个输入时，它假设它们可以按任何顺序填写。大多数人会先到后去，但有时可能会更方便地填写更多的自由泳。

如果您不希望用户在第二个内容中输入任何内容，直到他们完成了第一个内容，那么还没有显示。仅显示第一个输入，获取用户的输入，然后显示第二个输入。

最后，如果适用，请充分利用<input ... required />。

Answer 3

首先，这是真正糟糕的用户体验™。你不应该这样做有几个原因：

1. 显示有关您的界面常见错误的提醒令人讨厌
2. 这不会阻止用户填写输入
3. 您的解决方案不会引导用户正确使用您的界面

让我建议稍微好一些：

根据另一个输入的空白​​

禁用和启用一个输入

<script>
$('input#text1').change(function() {
  var $i2 = $('input#text2');

  if($(this).val().length() == 0) {
    $i2.attr('disabled','disabled');
    $i2.val('');
  } else {
    $i2.removeAttr('disable');
  }
});
</script>

Answer 4

$("#text2").change(function() {
if ($("#text1").val() === ""){
  alert("Please enter text1 first.");
}  });