javascript - jQuery:单击时淡入所选值

Question

我有一个包含 5 个值的选定框。我正在尝试淡入框中所选内容的输入。例如:如果选择了 input1，则在单击时淡入 input1。

这是我正在尝试做的事情:

$(document).ready(function(){
    $('.btn').click(function() {
               if($("#selectbox").value == 'Input1') {
            $(".input1").show();
        } else if($("#selectbox").value == 'Input2') {
            $(".input2").show();
        } else if($("#selectbox").value == 'Input3') {
            $(".input3").show();
        } else if($("#selectbox").value == 'Input4') {
            $(".input4").show();
        } else if($("#selectbox").value == 'Input5') {
            $(".input5").show();
        }
    }
});

这是一个不工作的 fiddle :

http://jsfiddle.net/rzMHJ/

Answer 1

您的代码有两个错误，这就是它不起作用的原因。

1. $("#selectbox").value 应该是 $("#selectbox").val()
2. 你还没有用 关闭你的点击事件);

在这个例子中使用 switch case 也更好。

工作演示:http://jsfiddle.net/naveen/Zn2yy/

更新(基于 Nick Cravers 评论)

对于这个特定场景，您可以像这样简化代码。
演示:http://jsfiddle.net/nick_craver/BWacA/