6

例: これらはドロップダウン リストの項目です。

<select name="cmbitems" id="cmbitems">
    <option value="price1">blue</option>
    <option value="price2">green</option>
    <option value="price3">red</option>
</select>

ユーザーが青を選択すると、下のテキスト フィールドに price1 の値が表示されます。

<input type="text" name="txtprice" id="txtprice" onClick="checkPrice()">

答えてくれてありがとう

4

4 に答える 4

7

select.onchange イベント ハンドラーで、入力の値を選択の値に設定するだけです。

var select = document.getElementById('cmbitems');
var input = document.getElementById('txtprice');
select.onchange = function() {
    input.value = select.value;
}

ここに jsFiddle デモへのリンクがあります

于 2012-05-09T16:44:21.907 に答える
1

jqueryを使用している場合は、そのまま使用してください

$('select.foo option:selected').val();    // get the value from a dropdown select

<input>更新（人口を含めるのを忘れていました）

まず、html ファイルに jquery を含めます。

<header>あなたはそれを含めます：

<header>
<script type="text/javascript" src="YOUR_PATH_TO_LIBRARY/jquery-1.7.1-min.js"></script>
</header>

それで

<input type="text" name="txtprice" id="txtprice" onClick="javascript:$('select.foo option:selected').val();">
于 2012-05-09T16:39:30.003 に答える
1

これは、現在選択されているオプションを検索し、その値を確認し、その表示テキストを使用して入力を更新する力ずくの方法です。Daniele が提案したように、jquery を自由に使用できる場合、これははるかに簡単になります。しかし、何らかの理由で JS フレームワークを使用できない場合は、これで必要なものが得られるはずです。

<select name="cmbitems" id="cmbitems" onchange="updateTextField()">
 ...
</select>
<input type="text" ..... />

<script type="text/javascript">
function updateTextField()
{
    var select = document.getElementById("cmbitems");
    var option = select.options[select.selectedIndex];
    if (option.id == "price1")
    {
        document.getElementById("txtprice").value = option.text;
    }
}
</script>
于 2012-05-09T16:41:10.970 に答える
1 
$.on('change', '#cmbitems', function() {
    $('#txtprice').val($('#cmbitems option:selected').val());
});
于 2012-05-09T16:44:32.410 に答える