Question

我有这个jQuery，我知道它是重复的。我需要一些帮助来清理它，我还是jQuery / JavaScript的新手！

    $(function () {
    $('form').each(function () {
        var form = $(this);
        form.find('.custSwitch_1').change(function () {
            if (form.find('.custSwitch_1:checked').length) {
                form.find('.custAction_1').prop('disabled', false).trigger("chosen:updated").trigger("change");
            } else {
                form.find('.custAction_1').prop({'disabled': true, 'selectedIndex': 0, 'value':''}).trigger("chosen:updated").trigger("change");
            }
        });
        form.find('.custSwitch_2').change(function () {
            if (form.find('.custSwitch_2:checked').length) {
                form.find('.custAction_2').prop('disabled', false).trigger("chosen:updated").trigger("change");
            } else {
                form.find('.custAction_2').prop({'disabled': true, 'selectedIndex': 0, 'value':''}).trigger("chosen:updated").trigger("change");
            }
        });
        form.find('.custSwitch_3').change(function () {
            if (form.find('.custSwitch_3:checked').length) {
                form.find('.custAction_3').prop('disabled', false).trigger("chosen:updated").trigger("change");
            } else {
                form.find('.custAction_3').prop({'disabled': true, 'selectedIndex': 0, 'value':''}).trigger("chosen:updated").trigger("change");
            }
        });
        form.find('.custSwitch_4').change(function () {
            if (form.find('.custSwitch_4:checked').length) {
                form.find('.custAction_4').prop('disabled', false).trigger("chosen:updated").trigger("change");
            } else {
                form.find('.custAction_4').prop({'disabled': true, 'selectedIndex': 0, 'value':''}).trigger("chosen:updated").trigger("change");
            }
        });
        form.find('.roof').change(function () {
            if (form.find('.roof:checked').length) {
                form.find('.sunroof').prop('disabled', false).trigger("chosen:updated").trigger("change");
                form.find('.antenna').button("enable");
            } else {
                form.find('.sunroof').prop({'disabled': true, 'selectedIndex': 0}).trigger("chosen:updated").trigger("change");
                form.find('.antenna').prop("checked", false).button("refresh").button("disable", "disable");
            }
        });
    });
});

我不知道是否使用循环，或类似

className.replace("custAction_", "custSwitch")

以及如何实施它......现在已经搜索了几天，似乎无法解决它的问题！

任何帮助都将不胜感激。

Answer 1

你可以使用循环。

$('form').each(function () {
    var form = $(this);
    for(var i = 1; i<= 4 ; i++){
        form.find('.custSwitch_' + i ).change(function () {
            if (form.find('.custSwitch_' + i + ':checked').length) {
                form.find('.custAction_' + i ).prop('disabled', false).trigger("chosen:updated").trigger("change");
            } else {
                form.find('.custAction_' + i ).prop({'disabled': true, 'selectedIndex': 0, 'value':''}).trigger("chosen:updated").trigger("change");
            }
        });
    }
    form.find('.roof').change(function () {
        if (form.find('.roof:checked').length) {
            form.find('.sunroof').prop('disabled', false).trigger("chosen:updated").trigger("change");
            form.find('.antenna').button("enable");
        } else {
            form.find('.sunroof').prop({'disabled': true, 'selectedIndex': 0}).trigger("chosen:updated").trigger("change");
            form.find('.antenna').prop("checked", false).button("refresh").button("disable", "disable");
        }
    });
});

Answer 2

感谢您的帮助，实际上得到了一些咖啡:-)并制定了这个解决方案...

            var switches = [1, 2, 3, 4];
        $.each(switches, function(index, value) {
            form.find('.custSwitch_' + value).change(function () {
                if (form.find('.custSwitch_' + value + ':checked').length) {
                    form.find('.custAction_' + value).prop('disabled', false).trigger("chosen:updated").trigger("change");
                } else {
                    form.find('.custAction_' + value).prop({'disabled': true, 'selectedIndex': 0, 'value': ''}).trigger("chosen:updated").trigger("change");
                }
            });
        });

不知道是否有更短的路......但我现在很开心！： - ）

有没有办法缩短这个jQuery？

2 个答案: