javascript - 检查数组中的所有值是否相同

我有一个网页，上面有一个文本框。

当用户向其中输入信息时，它会进行 AJAX 调用以检查输入是否有效，如果无效，它会禁用一个按钮。

他们还可以最多添加 10 个文本框，这是通过 jQuery 模板完成的。目前，每个文本框都有一个 serial 类，当一个 serial 文本框失去焦点时，会进行此检查。

如果他们输入一个无效的序列号，它会禁用按钮，但如果他们添加一个新的文本框并且它是有效的，按钮现在会被启用，这是错误的，因为仍然有一个是无效的。

我能想到的唯一方法是为每个文本框向数组中添加一个 1 或 0，一旦数组中的所有元素都是 1，就启用按钮。这是一个好方法吗？如果不是，请解释更好的方法。如果这是一个好方法，我如何检查 JavaScript 数组中的所有值是否相同？

谢谢

答案＃1

这听起来是一个好方法。你可以使用这个简单的 JavaScript 函数来检查 JavaScript 数组中的相等元素。你可以将其粘贴到 Firebug 控制台中以检查其功能。

// check if all elements of my_array are equal, my_array needs to be an array
function check_for_equal_array_elements(my_array){
  if (my_array.length == 1 || my_array.length == 0) {
     return true;
  }
  for (i=0;i<my_array.length;i++){
     if (i > 0 && my_array[i] != my_array[i-1]) {
       return false;
     }
  }
  return true;
}

//Example:
var my_array = [];
my_array.push(5);
my_array.push(5);

// will alert "true"
alert("all elements equal? "+check_for_equal_array_elements(my_array));

my_array.push(6);
// will alert "false"
alert("all elements equal? "+check_for_equal_array_elements(my_array));

答案＃2

我将假设你有一个 isValid(str) 函数，它返回一个布尔值。

既然你正在使用 jQuery，你可以利用 jQuery 的 filter() 函数来轻松检查是否有任何输入无效 每当输入失去焦点时：

$('.serial').live('blur', function () {

    // Get an array of all invalid inputs
    var invalids = $('.serial').filter(function () {
        return !isValid($(this).val());
    });

    // Does the array contain anything?
    $('#button').prop('disabled', invalids.length);

});

演示: http://jsfiddle.net/3RNV6/

类似的概念，但用于 AJAX：

$('.serial').live('blur', function () {
    var me = this;

    $.ajax({
       // ajax config
       success: function (data) {
           if (data === 'Y') $(me).addClass('valid');

           // Get an array of all invalid inputs
           var invalids = $('.serial').filter(function () {
               return !$(this).hasClass('valid');
           });

           // Enable if none invalid
           if (invalids.length === 0) $('#button').prop('disabled', false);
       }
    });
});

$('.serial').live('keypress', function () {
    $('#button').prop('disabled', true);
    $(this).removeClass('valid');
});