jquery - 2 つの選択ボックスのオプションを交換する方法

Question

以下のように 2 つの選択ボックスがあります。

    <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」を選択します。

ボタンをクリックすると、これらの 2 つの値が入れ替わります。セレクトボックス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;
});

しかし、私は結果を得ませんでした。私がやっている何が間違っていますか??

前もって感謝します、

しょうば。

Answer 1

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

私にとってはうまくいきます。