1

MySQL データベースには、アイテムの ID、名前、およびデフォルトの価格を含むアイテムのテーブルがあります。入力フィールドの価格を選択したアイテムのデフォルト価格に変更する、テーブル内のすべてのアイテムのドロップダウン メニューを含むフォームが必要です。Javascriptでこれを行うにはどうすればよいですか? 前もって感謝します。

4

5 に答える 5

2

HTML：

<select>
    <option>Select an item</option>
    <option data-price="20.00" value="1">Item 1</option>
    <option data-price="15.00" value="2">Item 2</option>
    <option data-price="24.00" value="3">Item 3</option>
</select>

<input type="text" id="price">

JavaScript（jQueryを使用）：

​$('select').on('change', function() {
    $("select option:selected").each(function () {
        $('#price').val('$' + $(this).attr('data-price'));
    });    
});​​​​​​​​

そして、実際の例については、このjsFiddleを参照してください：http：//jsfiddle.net/chnUn/

于 2012-08-18T17:25:52.747 に答える
0

jQueryを使用すると、次のようなことができます。

$("#DropDownId").change(function ()
{
    var selectedItem = $(this).val();

    if (selectedItem != null && selectedItem != '')
    {
          $("#InputId").val(selectedItem);
    }      
});
于 2012-08-18T17:26:06.257 に答える
0

サーバーから表示する必要のあるものをすべて取得します（できればJSONで）

selectこのように要素を生成します。

<select id="mySelect">
<option name="item1ID" defaultPrice="defaultPrice1" >ItemName1</option>
<option name="item2ID" defaultPrice="defaultPrice2" >ItemName2</option>
<option name="item3ID" defaultPrice="defaultPrice3" >ItemName3</option>
<option name="item4ID" defaultPrice="defaultPrice4" >ItemName4</option>
<option name="item5ID" defaultPrice="defaultPrice5" >ItemName5</option>
</select>

あなたは次のようなデフォルト価格を得ることができます

$("#mySelect").on('change',function(){
alert($(this).attr('defaultPrice');
});
于 2012-08-18T17:26:21.460 に答える
0

サーバー側の言語は何ですか?

私はちょうどこのようなことをします：

<script language="javascript">
var items = new Array();

<?
$res = mysql_query("SELECT id, name, price FROM ITEM_TABLE");

while($item_object = mysql_fetch_object($res)) {
    ?>
        items[<? echo $item_object->id; ?>] = "<? echo $item_object->price; ?>";
        ('#item_drop_down').append('<option value=' + <? echo $item_object->id; ?> + '>' + <? echo $item_object->name; ?> + '</option>');
    <?
}

?>

('#item_drop_down').Change('#item_price_input').text(items[('#item_drop_down').value()]);

</script>

ドロップダウンは item_drop_down で、価格が必要な入力は item_price_input です。

于 2012-08-18T17:29:38.740 に答える
0

以下のような選択ドロップダウンメニューを作成します。ここで、オプション値はアイテムの価格です

<select name="item_list" id="item_list" onchange="update_txt()">
<option value="">Select item</option>
<option value="10"> item1</option>
<option value="20">item2</option>
</select>
<input type="text" id="item_price" value="">

JS:

function update_txt(){
price = document.getElementById('item_list').selectedIndex.value;
document.getElementById('item_price').value = price;
}
于 2012-08-18T17:31:39.797 に答える