Question

我想创建一个函数：

如果用户在选择下拉列表中选择特定选项，则会将一些文本添加到textarea。

如果用户在select中选择其他选项，则将清除textarea。

我试过这个：

HTML

<select name="Problem" id="Problem">
<option value="option1">option1</option>
<option value="option2">option2</option>
<option value="option3">option3</option>
<option value="option4">option4</option>
</select>
<textarea name="csContent" id="csContent">

的jQuery

$("#Problem").on("change", function () {
    if ($('#Problem').val() == '3') {
        $('#csContent').html('blahblahblah');           
    } else {
        $('#csContent').val('');
    }
});

然而，这不起作用。我错过了什么吗？

Answer 1

使用条件运算符（？：）非常简单：

的 demo 的

$("#Problem").on("change", function () { $('#csContent').html( this.value.match("n3") ? "blahblahblah" : "" ); });

_{注意：.match（“n3”）（在值中搜索出现“n3”）方法也可能与option32匹配。如果您需要更具体而不是使用：

this.value === "option3" ? "blahblahblah" : ""}

Answer 2

工作正常，将值3更改为option3。

<select name="Problem" id="Problem">
<option value="option1">option1</option>
<option value="option2">option2</option>
<option value="option3">option3</option>
<option value="option4">option4</option>
</select>
<textarea name="csContent" id="csContent"></textarea>

$("#Problem").on("change", function () {
    if ($(this).val() == 'option3') {
        $('#csContent').val('blahblahblah');           
    } else {
        $('#csContent').val('');
    }
});

FIDDLE

您指定的值（3）与任何下拉选项的值都不匹配。

Answer 3

值检查不正确。应该根据option3而非3

进行检查

$("#Problem").on("change", function () {
    if ($(this).val() == 'option3') {
        $('#csContent').html('blahblahblah');           
    } else {
        $('#csContent').val('');
    }
});

Answer 4

它不起作用，因为你使用了错误的值

$('#problem').val() == '3'

永远不会真实，因为没有这样的价值。

使用此：

if ($('#Problem').val() == 'option3') {
  $('#csContent').html('blahblahblah');           
} else {
  $('#csContent').val('');
}

问题只有3将其替换为option3，您就可以开始了！

Answer 5

http://jsfiddle.net/FNaA9/

$("#Problem").on("change", function () {
if ($(this).val() == 'option3') {
    $('#csContent').html('blahblahblah');           
} else {
    $('#csContent').html('');
}
});

注意。else语句中的.val已更改为.html

这一点也很重要，否则您只能更改一次项目（尝试更改为选项3 - 然后选项1，然后再选择其他答案的选项3 - 它将不会再次更新文本框）

选择选项并在textarea中附加文本

5 个答案: