Jqueryフォーム - 隠された値をオプションIDに変更

Question

私の頭を痛めつけてこれを理解しようとしています。すぐにわかるでしょう...

隠された入力の値を設定するためにオプションidを使用しようとしましたが、何も解決されずに数百件のGoogle検索が行われました。

セレクタIDを使用して選択したオプションの値を取得する方法を知りましたが、オプションのIDを取得したいので、その一意のIDを非表示入力の値として設定できます。

<form> 
<select name="amount" id="item_number1"> 
    <option value="1" id="11">one</option> 
    <option value="2" id="22">two</option> 
    <option value="3" id="33">three</option> 
</select> 
<input type="button" value="Set Value" onclick="$('#item_number2').val($('#item_number1').val())"/> 
<input id="item_number2" type="text" /> 

シモンズ：このフォームで隠し入力イマイチ、この形式では、私は私のメソッドが動作している場合ので、私は視覚化することができ、テキスト入力フィールドを使用しています。

Answer 1

あなたはこのように選択されたオプションのIDを取得することができます：

<script> 
$(function(){ 
    var sItem = document.getElementById("item_number1"); 
    $("#transfer").on("click", function(){ 
    $("#item_number2").val(sItem[sItem.selectedIndex].id); 
    }); 
}); 
</script> 
<input type="button" id="transfer" value="Transfer ID" /> 
<select name="amount" id="item_number1"> 
    <option value="1" id="11">one</option> 
    <option value="2" id="22">two</option> 
    <option value="3" id="33">three</option> 
</select> 
<input type="text" id="item_number2" /> 

注意を、あなたは数字で、あなたのID値を開始すると仮定されていない - これは道をあなたのための問題を引き起こす可能性があります。このようなものについては、ルールに従うのがベストです。

デモ：http://jsbin.com/ucujex/edit#javascript,html,live

Answer 2

あなたがあなたのボタンのonclickを更新することができます。素敵な改善があなたがselectでオプションを変更すると、それが自動的に変化させることである

$("#item_number2").val($("#item_number1 option:selected").attr("id")); 

（あなたは必要はありませんボタン）をクリックします。

$("#item_number1").change(function() { 
    $("#item_number2").val($("option:selected", this).attr("id")); 
});