替代如果，否则如果，否则如果，否则，如果等在JavaScript

我有以下的代码，这取决于一个url参数的变化，然后隐藏窗体上的选择选项。即www.example.com?type=images替代如果，否则如果，否则如果，否则，如果等在JavaScript

最终会有超过20个不同的参数。我想知道一个更好的方法，而不是拥有大量的如果elses。只是大纲如何做到这一点很好，我是新手，所以我想能够接受答案并从中学习。谢谢。

var type = getURLparameter('type'); //from another function 

if (type == "images"){ 
    var selectDiv =('divid'); 
    var selectField = ('selectid'); 
    document.getElementById(selectField).options[1].selected=true; 
    document.getElementById(selectDiv).style.visibility="hidden"; 
} 
else if (type == "pizza") { 
    var selectDiv =('divid'); 
    var selectField = ('selectid'); 
    document.getElementById(selectField).options[2].selected=true; 
    document.getElementById(selectDiv).style.visibility="hidden"; 
} 
else (type == "cheese") { 
    var selectDiv =('divid'); 
    var selectField = ('selectid'); 
    document.getElementById(selectField).options[3].selected=true; 
    document.getElementById(selectDiv).style.visibility="hidden"; 
}

来源

2011-11-29 acowley

什么[开关]（http://www.w3schools.com/js/js_switch.asp）？ –

我会格式化您的HTML和这样的东西，以便您不需要特殊情况下的一切。 – Blender

我必须同意Blender的评论。如果你的结构做得好，你不需要if-elses *或* switch语句。 –

在不重复代码的兴趣，我会写你的代码像这与该指数NUM查找表，并且每个选项没有重复的代码：

var typeNum = { 
    images: 1, 
    pizza: 2, 
    cheese: 3 
}; 

var type = getURLparameter('type'); 

if (type in typeNum) { 
    document.getElementById('selectid').options[typeNum[type]].selected = true; 
    document.getElementById('divid').style.visibility = "hidden"; 
}

来源

2011-11-29 01:23:56 jfriend00

我很确定这就是我要找的。谢谢！ – acowley

也许switch声明将帮助您

http://www.tutorialspoint.com/javascript/javascript_switch_case.htm

还设置之前的所有selectDiv减少代码:)

switch(type) { 
    case 'images': 
     //blah 
     break; 
}

来源

2011-11-29 01:16:57 tekknolagi

哦....他们错了，但是开关是正确的 – tekknolagi

@PHPBree那里，修好了！ – tekknolagi

@AlienWebguy我也这么认为，但他是对的 – tekknolagi

使用一个开关量：

var selectDiv = document.getElementById('divid'), 
    selectField = document.getElementById('selectid'); 

switch(type){ 
    case "images": 
     selectField.options[1].selected=true; 
     selectDiv.style.visibility="hidden"; 
    break; 

    case "pizza": 
     selectField.options[2].selected=true; 
     selectDiv.style.visibility="hidden"; 
    break; 

    case "cheese": 
     selectField.options[3].selected=true; 
     selectDiv.style.visibility="hidden"; 
    break; 
}

来源

2011-11-29 01:19:47 AlienWebguy

重复的代码可以从switch语句中移出。 – jfriend00

为什么downvote？这个答案没用吗？ – AlienWebguy

downvote不是我。我认为低估应该需要一些解释。 – jfriend00

将它们放在一个对象中，并查找所需的一个。

var type_table = { 
    images: { 
     div_id: 'somevalue', 
     select_id: 'somevalue', 
     option_index: 0 
    }, 

    pizza: { 
     div_id: 'somevalue', 
     select_id: 'somevalue', 
     option_index: 1 
    }, 

    cheese: { 
     div_id: 'somevalue', 
     select_id: 'somevalue', 
     option_index: 2 
    } 
};

然后...

var the_type = type_table[ type ]; 

document.getElementById(the_type.select_id).options[the_type.option_index].selected=true; 
document.getElementById(the_type.div_id).style.visibility="hidden";

如果ID其实都是一样的，那么自然应该缓存这些元素，而不是重新选择他们，唯一你需要存储在该表将是索引号。

这听起来像唯一的独特部分是索引。如果是这样，这样做：

var type_table = { 
    images:0, 
    pizza:1, 
    cheese:2, // and so on 
}; 

var the_div = document.getElementById('div_id'); 
var the_select = document.getElementById('select_id');

然后运行该代码的函数内...

the_select.options[ type_table[ type ] ].selected=true; 
the_div.style.visibility="hidden";

来源

2011-11-29 01:20:36 RightSaidFred

也使用了一些这种解决方案。如果我有更多的代表。我肯定会赞成。谢谢你的帮助。 – acowley

document.getElementById(selectField).options[(type == "images" ? 1 : (type == "pizza" ? 2 : 3))].selected=true; 
document.getElementById(selectDiv).style.visibility="hidden";

来源

2011-11-29 01:23:22 Godwin

你可以使用的功能的阵列，类似于以往普惠在c＃ - [R字典溶液，

var mySwitch={}; 
mySwitch['images'] = function(){ 
    var selectDiv =('divid'); 
    var selectField = ('selectid'); 
    document.getElementById(selectField).options[1].selected=true; 
    document.getElementById(selectDiv).style.visibility="hidden"; 
}; 
mySwitch['pizza'] = function(){...};

然后执行

mySwitch[type]();

来源

2011-11-29 01:29:33

替代如果，否则如果，否则如果，否则，如果等在JavaScript

回答

相关问题