Question

在输入是用户输入的颜色名称的情况下，我正在尝试验证用户输入，这是代码段

let valideColor = false;

do{

      const selected_color = $('#SelectedColorPicker').val();

        if (selected_color === '') {
            console.log('Not valid')
        }
        else {
            validColor = true;
        }

}while(!validColor)

上面的代码产生一个无限循环，导致我的浏览器崩溃，如果有人能告诉我问题出在哪里，我将不胜感激。

Answer 1

您有一个无限循环，因为您正在循环中连续运行代码，而没有给用户提供输入任何输入的机会-当用户输入是使validColor为真的唯一方法时，因此打破循环。

在这里，循环是完全错误的方法。您仅需要在某些时候进行检查，大概是在用户尝试提交此输入所包含的任何形式时。因此，您应该执行以下操作：

$("#idOfMyForm").submit(function(e) {
    const selected_color = $('#SelectedColorPicker').val();

    if (selected_color === '') {
        console.log('Not valid');
        e.preventDefault();
    }
});

警告用户（尽管没有打开浏览器控制台的人当然不会注意到console.log，但绝大多数用户也不会注意到），并停止提交表单。< / p>

Answer 2

您可以使用

let validColor = false
  $('#SelectedColorPicker').on("change",function(){
      if ($(this).val() === '') {
        console.log('Not valid')
      }
      else {
        validColor = true;
      }

  });

Answer 3

您可以使用输入

$('#SelectedColorPicker').on("input", function() {
   var selected_color = this.value;
   console.log(selected_color);
});

无法验证JavaScript中的用户输入

3 个答案: