如何禁用选择中的错误选项取决于所选选项

How disable wrong options in selects depend on selected option?

本文关键字：选项 取决于 错误 何禁用 选择      更新时间：2023-09-26

我想创建一个简单的数学练习js脚本。

例如：给出总和 （=10），有四个选择，数字从 0 到 10。如果我选择一个数字，我应该禁用错误的选项。我的意思是，所选选项的总和不能大于 10。

我尝试了这种方式：点击这里

$(document).on("change", "select.number", function(){
    var sum = 10;
    var number = $(this).children("option:selected").val();
    var sum_number = 0;
    $("select.number option:selected").each(function(){
        sum_number = parseInt($(this).val(),10) + parseInt(sum_number,10);
    });    
    $("select.number option").attr("disabled", false);
    if(sum_number>0){
        var act_person = act_max_person = 0;
        $("select.number").each(function(){
            $(this).children("option:not(:first)").each(function(){   // first is 0
                if(parseInt($(this).val(),10) + parseInt(sum_number,10) > sum) $(this).attr("disabled", true);
            });
        });
    }
});

但它远非完美...

尝试

$(document).on("change", "select.number", function () {
    var sum = 10;
    var number = $(this).children("option:selected").val();
    var sum_number = 0;
    $("select.number option:selected").each(function () {
        sum_number += parseInt($(this).val(), 10);
    });
    $('select.number option').prop('disabled', false);
    if (sum_number > 0) {
        var diff = sum - sum_number;
        $('select.number').each(function () {
            var idx = parseInt($(this).val(), 10) + diff + 1;
            $(this).find('option').slice(idx).prop('disabled', true)
        })
    }
});

演示：小提琴

相关文章：