需要摆脱许多如果答案

【问题标题】：Need to Get the rid of many if's需要摆脱许多如果
【发布时间】：2012-08-24 19:14:20
【问题描述】：

我的 java 脚本中有全局变量。现在每次调用内部函数时我都会得到不同的值。我需要创建一个选项标签，其中包含属性中的选定值和一个基于变量没有选定值的选项标签。我想这更令人困惑，让我举个例子。

var a1 = "a1c" // default value but may change

if(a1 == "all")
{
    var allstatusdefault = '<option value="all" selected="selected">All</option>';
}
else
{
    var allstatusdefault = '<option value="all" >All</option>';
}

if(a1 == "a1b")
{
    var allstatusdefault1 = '<option value="a1b" selected="selected">a1b</option>';
}
else
{
    var allstatusdefault1 = '<option value="a1b" >a1b</option>';
}

if(a1 == "a1bc")
{
    var allstatusdefault2 = '<option value="a1bc" selected="selected">a1bc</option>';
}
else
{
    var allstatusdefault2 = '<option value="a1bc" >a1bc</option>';
}

这只是示例，但我必须生成许多具有不同值的选项标签。如果..任何人有任何其他想法，我不想写很多东西？

【问题讨论】：

有很多方法可以完成这样的事情。请为您的具体问题提供一些额外的背景信息。
我猜上面的代码解释了一切。只需要摆脱许多如果。每次我得到不同的值并且基于该值我必须选择我需要选择哪个项目作为默认值。所以底线是一值二选项标签。
添加选项，然后在最后选择一个。

标签： javascript refactoring

【解决方案1】：

提取公共代码，我看到这里有很多重复。

var a1 = "a1c";

function buildOption(id) {
    var selected = (a1 == id? ' selected="selected"' : '');
    return '<option value="' + id + '"' + selected + '>' + id + '</option>';
}

var allstatusdefault =  buildOption('all');
var allstatusdefault1 = buildOption('a1b');
var allstatusdefault2 = buildOption('a1bc');

【讨论】：

在buildOption 中不需要return 吗？
@DourHighArch：当然，太多了scala，已修复，谢谢！

【解决方案2】：

从这里我可以推断出你应该做什么

var default1 = '<option value="'+a1+'" selected="selected">'+a1+'</option>';
var default2 = '<option value="'+a2+'" selected="selected">'+a2+'</option>';

由于a1 的值在字符串中被重用，不如直接设置它而不是使用多个 if 语句。

注意：当你有很多 if 语句时，这是使用 switch 语句的绝佳机会

【讨论】：

你不处理选中/未选中的部分。

【解决方案3】：

首先，了解switch...case。在您的情况下，您似乎可以通过将变量连接到字符串来简单地使用变量本身来形成字符串。

【讨论】：

鉴于每个if/else 组合都设置了一个不同的变量并且其中任何一个都将执行，switch 可能会有点麻烦。

【解决方案4】：

  var a1 = "a1bc" // default value but may change
    switch(a1)
        {
        case "all" : allstatusdefault = '<option value="all" selected="selected">All</option>';break;
        case "a1b" : allstatusdefault = '<option value="a1b" selected="selected">a1b</option>'; break;
        case "a1bc" :  allstatusdefault = '<option value="a1bc" selected="selected">a1bc</option>'; break;
        default :  allstatusdefault = '<option value="all" >All</option>';break;
        }
    window.alert(allstatusdefault);

【讨论】：

我想我不确定上面的代码是如何工作的。因为如果 allstatusdefault 没有值“a1b”，那么我需要生成选项标签，其值类似于。在这种情况下，默认值应始终为“all”。我不想要那个..
很明显你不理解它，因为你有很多ifs，这可能会导致意想不到的结果。这里发生的是字符串 a1 被评估。如果它匹配单词case 后面的任何字符串，那么它将执行: 和;break; 之间的所有内容default : 后面的内容是当字符串a1 不匹配任何情况时会发生的情况。你可以在那里填写任何你想要的值。

【解决方案5】：

我认为从您编写代码的方式来看，您可以使用 jQuery 来完成。首先创建整个 HTML，所有选项值都使用 jQuery 对象，如下所示：

var $optionHTML = $('<option value=""> Blahblah </option>'); 现在你可以将所有 jquery 函数应用到这个人身上。所以你附加一个这样的新选项。

$optionHTML.append('<option>...</option>')

当你完成所有选项元素时，使用 jquery 选择器方法找到一个元素，其选项的值属性与a1c 匹配，然后添加属性selected 然后你就完成了。

如果您需要一些入门代码，请告诉我。

谢谢。

编辑：

这就是答案

<html>
<head>
    <script type = "text/javascript" src= "http://code.jquery.com/jquery-1.8.0.min.js"></script>
    <script type = "text/javascript">
        $(document).ready (function () {
            var value = "test 2";
            $select = $("<select></select>");
            $optionHTML1 = $('<option value="test 1">Test 1</option>');
            $optionHTML2 = $('<option value="test 2">Test 2</option>');
            $optionHTML1.appendTo($select); 
            $optionHTML2.appendTo($select);
            $select.find("[value='test 2']").attr('selected','selected');
            alert($select.html());  
            $("div").append($select);
        });
    </script>
    <style type = "text/css">
    </style>
</head>
<body>
    <div>
    </div>
</body>

【讨论】：

即使您在选择框中有 200 个选项值，此代码也将起作用。您不必应用 switch，它会正常工作并且是可扩展的。
我正在寻找在 HTML 构建时构建一个符合我所有条件的字符串。谢谢
@ravipatel 但是当您使用选项时，可能只有一个值可以从正确的选项中选择，然后此解决方案将 wotk。我目前正在尝试它。谢谢。