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

jQuery trigger event after changing multiple select options

本文关键字:jQuery 触发器 事件 选项 选择      更新时间:2024-06-19

我正试图在选择更改时触发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>

我能想到的一种方法是检查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);
                };
            };
        };