javascript - 如果语句无法正确比较，则 JQuery 选择值

Question

我正在测试通过将所选值与字符串进行比较来查看 if 语句的工作情况，然后显示弹出警报。但是，无论我具体选择什么，警报结果总是显示“关闭”。似乎 if 语句比较不正确。这是我的代码，

$("#options").change(function(){
                                var selected = $("option:selected", this).val();

                                if(selected == 'line 2')
                                {
                                    alert("line 2");
                                }
                                else if(selected == 'line 3')
                                {
                                    alert("line 3");
                                }
                                else if(selected == 'line 4')
                                {
                                    alert("line 4");
                                }
                                else if(selected == 'line 8')
                                {
                                    alert("line 8");
                                }
                                else
                                {
                                    alert("off");
                                }

                    });

HTML下拉代码，

<select id="options">
                <optgroup label="Caption">
                    <option value="off1">Off</option>
                    <option selected value="2 line">2 Lines</option>
                    <option value="3 line">3 lines</option>
                </optgroup>
                <optgroup label="Transcript">
                    <option value="off2">Off</option>
                    <option value="4 line">4 Lines</option>
                    <option value="8 line">8 lines</option>
                </optgroup>
            </select>

Answer 1

值是2 line并且您正在比较line 2（例如）

尝试这个;

var selected = $("option:selected", this).val();
    if(selected == '2 line')
       {
         alert("line 2");
       }

Answer 2

您所有选项的价值都与您的测试相反。

$("#options").change(function(){
                            var selected = $("option:selected", this).val();
                            alert(selected); 
                            if(selected == 'line 2')
                            {
                                alert("line 2");
                            }
                            else if(selected == 'line 3')
                            {
                                alert("line 3");
                            }
                            else if(selected == 'line 4')
                            {
                                alert("line 4");
                            }
                            else if(selected == 'line 8')
                            {
                                alert("line 8");
                            }
                            else
                            {
                                alert("off");
                            }

                });

添加该警报将帮助您针对正确的值进行测试。

Answer 3

您要比较的值与 html 中的值不匹配。

Answer 4

您在测试中恢复了行文本，并且您最好使用数组来实现这一点。

(function() {
    var selectionValues = [
        '2 line',
        '3 line',
        '4 line',
        '8 line'
    ];


    $("#options").change(function() {
        var selected = $("option:selected", this).val();

        var index = selectionValues.indexOf(selected);
        var result;

        if (index !== -1) {
            result = selectionValues[index];
        }
        else {
            result = "Off";
        }

        alert(result);
    });
})();