2

有没有更好的方法来优化 jQuery 中的以下 IF 语句？

我不得不多次编辑以下代码，如果我可以将必要的值插入一个不错的数组或其他东西中，那就太好了......

 $("#pmselect").change(function () {
        if ($("#pmselect option:selected").attr("class") == "null") {
            $('.avatar').hide();
            $('.pmpass').hide();
            $('.pmlogin').hide();
            $('#nullavatar').show();
        }
        if ($("#pmselect option:selected").attr("id") == "pm") {
            $('.avatar').hide();
            $('.pmpass').show();
            $('.pmlogin').show();
            $('#pmavatar').show();
        }
        if ($("#pmselect option:selected").attr("id") == "as") {
            $('.avatar').hide();
            $('.pmpass').show();
            $('.pmlogin').show();
            $('#asavatar').show();
        }
        if ($("#pmselect option:selected").attr("id") == "pn") {
            $('.avatar').hide();
            $('.pmpass').show();
            $('.pmlogin').show();
            $('#pnavatar').show();
        }
        if ($("#pmselect option:selected").attr("id") == "jm") {
            $('.avatar').hide();
            $('.pmpass').show();
            $('.pmlogin').show();
            $('#jmavatar').show();
        }
        if ($("#pmselect option:selected").attr("id") == "mh") {
            $('.avatar').hide();
            $('.pmpass').show();
            $('.pmlogin').show();
            $('#mhavatar').show();
        }
        if ($("#pmselect option:selected").attr("id") == "rh") {
            $('.avatar').hide();
            $('.pmpass').show();
            $('.pmlogin').show();
            $('#rhavatar').show();
        }
        if ($("#rmselect option:selected").attr("id") == "rm") {
            $('.avatar').hide();
            $('.pmpass').show();
            $('.pmlogin').show();
            $('#rmavatar').show();
        }
    });
4

3 回答 3

3

您可以使用开关/案例，这样您就可以合并在多种情况下完成的某些事情......

switch( $("#pmselect option:selected").attr("id") ){
  case 'pm':
    //do stuff
    break;
  case 'xyz':
  case 'rh':
   //do stuff for xyz and rh
  case 'mh': 
   // do stuff for mh only
   break;
}
于 2013-03-02T12:33:04.720 回答
0

试试这个：

$("#pmselect").change(function () {
        $('.avatar').hide();
        if ($("#pmselect option:selected").attr("class") == "null") {
            $('.pmpass, .pmlogin').hide();
            $('#nullavatar').show();
        } else {
            var id = $("#pmselect option:selected").attr("id");
            $('.pmpass, .pmlogin').show();
            $('.pmlogin').show();
            $('#' + id + 'avatar').show();
        }
    });
于 2013-03-02T12:38:47.220 回答
0

假设$("#rmselect option:selected")最后一个 if 表达式是一个错字（归功于鹰眼@RaymondChen），我想你会发现代码简化为：

$("#pmselect").change(function () {
    var opt = this[this.selectedIndex],
        isNull = $(opt).hasClass('null'),
        id = isNull ? 'null' : opt.id;
    $('.avatar').hide();
    $('.pmpass, .pmlogin')[isNull ? 'hide' : 'show']();
    $('#' + id + 'avatar').show();
});

看不见if:)

如果$("#rmselect option:selected")不是拼写错误，则需要单独处理#rmselect 条件。

于 2013-03-02T13:19:16.173 回答