0

我有两个选择框，如下所示。

    <form name="test">
        <select id="s1" name="select1">
         <option selected>1</option>
         <option>2</option>
         <option>3</option>
        </select>

        <select id="s2" name="select2">
         <option>1</option>
         <option>2</option>
         <option selectd>3</option>
        </select>

<input type="button" value="swap" id="swap">

    </form>

在选择框 1 中选择“1”，在选择框 2 中选择“3”。

现在通过单击一个按钮，这两个值应该交换。在选择框 1 中表示“3”，在选择框 2 中表示“1”。

我为此尝试了一些jquery。该代码如下。

$("#swap").click(function(){
 v1=document.getElementById("s1");
 v2=document.getElementById("s2");
 document.form.select1.value=v2;
 document.form.select2.value=v1;
});

但我没有得到结果。我在做什么错。？？

提前致谢，

绍巴。

4

2 回答 2

8 
$('#swap').click(function(){
    var v1 = $('#s1').val(),
        v2 = $('#s2').val();
    $('#s1').val(v2);
    $('#s2').val(v1);
});

对我来说很好。

于 2013-05-03T05:06:29.933 回答
0 
  <select name="" id="select_one" multiple>
     <option value="1">1</option>
     <option value="2">2</option>
     <option value="3">3</option>
     <option value="4">4</option>
  </select>
  <button onclick="swap('select_one','select_two','left_to_right')">--></button>
  <button onclick="swap('select_one','select_two','right_to_left')"><--</button>
  <select name="" id="select_two" multiple>
     <option value="5">1*5</option>
     <option value="6">2*5</option>
     <option value="7">3*5</option>
     <option value="8">4*5</option>
  </select>
  <script>
     var cloneArr = function(arr){
         var result = [];
         for(var item=0; item<arr.length;item++){
             result[item]=arr[item];
         }
         return result;
     }
     
     function swap(select_one,select_two,direction='left_to_right') {
         select_one = document.querySelector('#select_one');
         select_two = document.querySelector('#select_two');            
         if (direction=='left_to_right') {
             var oneOptions = select_one.selectedOptions;
            var arr = cloneArr(oneOptions);
             for(var item=0; item<oneOptions.length;item++){
                 select_one.remove(oneOptions[item].index);
             }
             for(var item=0; item<arr.length;item++){
                 select_two.add(arr[item]);
             }
         }
     
         if (direction=='right_to_left') {
             var twoOptions = select_two.selectedOptions;
            var arr = cloneArr(twoOptions);
             for(var item=0; item<twoOptions.length;item++){
                 select_two.remove(twoOptions[item].index);
             }
             for(var item=0; item<arr.length;item++){
                 select_one.add(arr[item]);
             }
         }
         
     }
  </script>
于 2021-01-26T09:00:36.213 回答