Jquery切换下拉值

时间:2014-02-27 22:51:15

标签: javascript jquery

我一直在尝试创建一个jquery函数,该函数将为表行中的所有选择设置toogle值。我想出了这个解决方案

$(function () {
    $(".toogle").click(function () {
        if ($(this).hasClass("on") === true) {
            $(this).addClass("off");
            $(this).removeClass("on");
        } else {
            $(this).addClass("on");
            $(this).removeClass("off");
        }

        $(this).each(function () {

            if ($(this).hasClass("on") === true) {
                $(this).closest('tr').find('select').each(function () {
                    $(this).val("1");
                });
            } else {
                $(this).closest('tr').find('select').each(function () {
                    $(this).val("0");
                });
            }

        });
    });
});

您可以在此处查看完整代码:http://jsfiddle.net/7BZNe/

但想知道是否可以更好的方式完成。

1 个答案:

答案 0 :(得分:3)

这里有很多简化空间:

http://jsfiddle.net/zt974/

$(".toogle").click(function () {
    $(this)
        .toggleClass("on off")
        .closest('tr')
        .find('select')
        .val($(this).hasClass("on") ? "1" : "0");
});