javascript - 如何循环访问页面上的所有单选或复选框输入并返回返回的值的组合？

Question

我有一组 4 组 radio 输入。我需要循环遍历所有这些并返回用户选择的组合，以便我可以根据组合执行操作。现在我只是使用大量的 if 语句，我知道我做错了。我想循环遍历它们，如果组合 x 返回，那么我可以将显示的图像更改为某个图像，或者如果组合 y 返回，我可以更改为不同的图像。所以我认为我应该做的是为每个可能的结果定义一组已检查的 radio ，然后在循环完成后检查其中一个数组是否为真。如果是，则显示该组合的相应图像。这听起来是正确的方法吗？所以目前我让它循环并返回值。当我检查哥伦比亚广播电台时，我希望 array 等于 array1，它应该提醒我，但事实并非如此。

 <div class="controls">
                <div class="models">
                    <h4>Makes</h4>
                    <form>
                      <input id="coronado" type="radio" name="make" value="stock" checked> Coronado

                      <input id="columbia" type="radio" name="make" value="white"> Columbia
                    </form> 
                </div>
                <div class="models">
                    <h4>Models</h4>
                    <form>
                      <input id="day-cab" type="radio" name="model" value="day-cab" checked> Day Cab
                       <input id="mid-roof" type="radio" name="model" value="mid-roof"> Mid Roof

                      <input id="raised-roof" type="radio" name="model" value="raised-roof"> Raised Roof
                    </form> 
                </div>
                <div class="colors">
                    <h4>Colors</h4>
                    <form>
                      <input id="stock" type="radio" name="color" value="orange" checked> Stock

                      <input id="white" type="radio" name="color" value="white"> White
                    </form> 
                </div>
                <div class="accessories">
                    <h4>Accessories</h4>
                    <form>
                      <input id="stock-wheels" type="radio" name="accessories" value="stock-wheels" checked> Stock Wheels

                      <input id="with-spinners" type="radio" name="accessories" value="spinners"> Spinners
                    </form> 
                </div>

            </div>

var array = [];
var array1 = ["columbia","day-cab","orange","stock-wheels"];
$(':radio').change(function() {
    $(":radio:checked").each(function(i, e)  {
    array[i] = $(this).val();
    });
    if (array == array1) {
        alert(array);
    } 
});

Answer 1

数组实际上只是底层的对象，因此即使比较两个空数组也会返回 false。

var array1 = [];
var array2 = [];
array1 == array2 //evaluates to false

您要么想使用另一个循环来迭代内容并将一个数组的每个内容与另一个数组的内容进行比较(我相信这将是 O(n^2) 时间)。或者，您可以将数组的字符串化版本存储在哈希表上，然后在恒定时间内检查哈希表。另一个好处是您可以将图像存储在同一位置。我相信它将把查找变成一个常数时间操作 O(1)。

var array = [1,2,3,4];
var hashTable = {};
hashTable[JSON.stringify(array)] = (Your image here);

要比较新数组，您只需像普通键值对查找一样查找它即可。

var img = hashTable[array];