Jquery If/Else具有多个选择选项

我有一个带有选择字段的表单，允许选择多个选项：

<label for="test">Select One</label>
<br/>
<select id="test" multiple="multiple">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>

和对应于每个值的字段：

<label for="one">Enter One</label><input type="text" id="one">
<label for="two">Enter Two</label><input type="text" id="two">
<label for="three">Enter Three</label><input type="text" id="three">

我试图做的是将一个跨度附加到所选的相应标签上，如果用户选择多个选项，它会将跨度应用到多个标签上。这就是我被卡住的地方，因为它只适用于我选择的第一个选项：

var $span = $('<span class="form-required" title="This field is required.">*</span>');

$('#test').change(function(){
    var val = $(this).val();

if (val == '1') {
$('label[for="one"]').append($span);
}
else
if (val == '2') {
$('label[for="two"]').append($span);
}
else
if (val == '3') {
$('label[for="three"]').append($span);
}
});

---

我如何才能让它与多个选项一起工作？

我认为没有必要使用if语句。我相信你想要一个点击事件

请参见以查看如何引用每个选定选项。然后，只需为从is数组返回的每个

val追加

您可以在每个标签上添加一些值可以匹配的属性，然后迭代数组

HTML

JS

---

逻辑是倒退的。Span需要附加到dom中的标签

<label for="one" data-value="1">Enter One</label>

 // use string or have to clone jQuery object each time
var span ='<span class="form-required" title="This field is required.">*</span>';

$('#test').change(function() {
  var values = $(this).val();// returns array
  // remove prior spans
  $('label[data-value]').find('span.form-required').remove();
  // loop over values
   values.forEach(function(val){
      // append to matching label
      $('label[data-value='+val+']').append(span);
   });

});