Question

我有一张select field.的表单当用户选择value时，我想要display this value。

html是：

<select name="number" id="number">
        <option value="1">2</option>
        <option value="2">4</option>
</select>

<div id="test">2</div>

和jquery是

$(function() {
    $('#number').change(function() {
        var test = $('#test');
        if($('select[name="number"]').val() == '4'){
            test.html('select 4');
        }else{
            test.html('select 2');
        }
    });    
});

它只适用于第一个选择（虽然有错误的值）然后它不想工作。

这里有一个jsFiddle：http://jsfiddle.net/tomlazada/4sRmG/

Answer 1

您没有价值4

的任何选项

if($('select[name="number"]').val() == '4'){

将其更改为

Fiddle Demo

if($('select[name="number"]').val() == '2'){

<强>问题

<option value="2">4</option>
//             ^ value is 2 not 4

或者

Fiddle Demo

如果你想用选项

的文字来做

if ($('select[name="number"] option:selected').text() == '4')

Answer 2

您将<option>（4）内的文字（<option>）与2的值混淆了（这是4）。

要解决您的问题，请执行一个 3：

1）。将您的html更改为（因此选项的值为4，而不仅仅是内部文字<option value="1">2</option> <option value="4">4</option>）：

2

2）。或您的jQuery代码（因此您选择值为if($('select[name="number"]').val() == '2'){的选项）：

4

3）。或您的jQuery代码（最好不要通过文字进行检查，但是如果您希望保持html“按原样”并仍然因某种原因使用if($('select[name="number"] option:selected').text() == '4'){）：

{{1}}

另外，如提及 @Dinu ，请考虑较短的表示法。

Answer 3

尝试低于其工作正常。你写了很多不必要的代码

$('#number').change(function(){
    $('#test').html('Selected: ' + $('#number').val());
});

在jquery中显示select字段的值

3 个答案: