Question

我有一个带有选择字段的表单，后跟一个添加按钮。当用户点击添加时，我希望选择要添加到数组中的任何项目，以便我可以将其传递给我的表单

//这是我的可见字段

<select id="contactsFollow" name="contactsFollow">
  <option value="1">option 1</option>
  <option value="2">option 2</option>
  <option value="3">option 3</option>
</select> 
<button type="button" class="btn">Add</button>

这对我来说最好的方法是什么？我假设jquery会这样做，但我不知道如何实现。

Answer 1

演示：http://jsfiddle.net/MsNKR/

$('.btn').click(function () {
  $('#contactsFollow :selected').appendTo('#contactsFollowSelected');
});

或演示：http://jsfiddle.net/zvQgq/如果您不想从第一次选择中删除选项

$('.btn').click(function () {
  $('#contactsFollow :selected').clone().appendTo('#contactsFollowSelected');
});

Answer 2

我不知道你在尝试做什么...但是将它添加到选择并将其传递给表单对我来说没有意义，因为你需要再次选择隐藏的选择框以将其传递给表单。无论如何，jquery对我来说是最好的选择..

以下是你如何做到这一点..

$('.btn').click(function () {
  $('#contactsFollow :selected').appendTo('#contactsFollowSelected');
});

<强>已更新

制作隐藏的输入字段..

<input type="hidden" name="selectedoption" id="selectedoption" value="" />

<强> jquery的

$('.btn').click(function () {
   var selected=$('#contactsFollow :selected').val();
   var hiddeninputValue=$('#selectedoption').val();
   if(hiddeninputValue==""){
      $('#selectedoption').val(selected);
   }else{
      $('#selectedoption').val(hiddeninputValue + ',' + selected);
   }
   $('#contactsFollow :selected').remove();
});

在将数据插入db ..

之前，用'，'分隔隐藏值

示例fiddle

添加项目以选择字段表单 - Jquery

2 个答案: