更改多个选择选项后的jQuery触发事件

Question

我正在尝试在选择更改上触发variationCheck函数，但是有什么方法可以在触发函数之前先选择两个选择选项？

有点像验证，但是如果用户决定在验证后更改选择选项，仍然能够一次又一次触发功能。 我希望这是有道理的。

任何帮助都会有所帮助！ 谢谢。

屏幕截图

JS

$("select[name=attribute_covers],select[name=attribute_extras]").change(function(){
            var get_product_id = $(this).closest('form').data('product_id').replace('form_','');
            variationCheck(get_product_id);
        });

        function variationCheck(get_product_id) {
            for (var i = 0; i < variationArray.length; i++) {
                if (variationArray[i].product_id === get_product_id) {
                    alert(get_product_id);
                };
            };
        };

的HTML

<table class="variations" cellspacing="0">
    <tbody>
        <tr>
            <td class="label">
                <label for="covers">Covers</label>
            </td>
            <td class="value">
                <select id="covers" class="" name="attribute_covers" data-attribute_name="attribute_covers">
                    <option value="" selected="selected">Choose an option</option>
                    <option value="5" class="attached enabled">5</option>
                    <option value="6" class="attached enabled" selected="selected">6</option>
                    <option value="7" class="attached enabled">7</option>
                    <option value="8" class="attached enabled">8</option>
                    <option value="9" class="attached enabled">9</option>
                    <option value="10" class="attached enabled">10</option>
                </select>
            </td>
        </tr>
        <tr>
            <td class="label">
                <label for="extras">Extras</label>
            </td>
            <td class="value">
                <select id="extras" class="" name="attribute_extras" data-attribute_name="attribute_extras">
                    <option value="" selected="selected">Choose an option</option>
                    <option value="Fruit" class="attached enabled">Fruit</option>
                    <option value="Cake" class="attached enabled">Cake</option>
                </select><a class="reset_variations" href="#" style="visibility: visible;">Clear</a> </td>
        </tr>
    </tbody>
</table>

Answer 1

我能想到的一种方法是同时检查Select元素的值和调用验证方法（如果两者均被选中）：

$("select[name=attribute_covers],select[name=attribute_extras]").change(function(){
            var get_product_id = $(this).closest('form').data('product_id').replace('form_','');
            if($("select[name=attribute_covers]").val() != "" && $("select[name=attribute_extras]").val() != ""){
            variationCheck(get_product_id);
           }
        });

        function variationCheck(get_product_id) {
            for (var i = 0; i < variationArray.length; i++) {
                if (variationArray[i].product_id === get_product_id) {
                    alert(get_product_id);
                };
            };
        };