0

div テキストを Selectbox オプションの選択されたテキストに変更するにはどうすればよいですか...

100 を超える値を持つ選択ボックスがあります


シナリオ: 選択ボックスからオプションを選択するとすぐに、同じオプション値 (テキスト) を、ccyクラス<div class="ccy">blablabla</div>class を持つ関連する div テキストに置き換える必要があります...


例: EUR、USD、JPY、INR などの選択ボックスがあります。選択ボックスからEURを選択すると、クラスccy <div class='ccy'>currency 1</div><div class='ccy'>currency 2</div>を持つ関連する div を次のように変更する必要があり<div class='ccy'>EUR</div><div class='ccy'>EUR</div>ます。

フィドル

HTML

<select id="currencty-selectbox">
    <option value="1">EUR</option>
    <option value="2">USD</option>
    <option value="3">JPY</option>
    <option value="4">CAD</option>
    <option value="5">MXN</option>
    <option value="6">CZK</option>
</select>


<div class='ccy'>currency 1</div>
<div class='ccy'>currency 2</div>

jQuery

$('#currencty-selectbox').on('change', function() {
    alert( $(this).find(":selected").text() );
});
4

6 に答える 6

2
$('#currencty-selectbox').on('change', function () {
    $('.ccy').text($(this).find(":selected").text());
    // ^^^^^^
}).trigger('change');

デモ: https://jsfiddle.net/tusharj/ts0L5xej/1/

于 2015-05-14T09:18:23.340 に答える
1

同じ注文がある場合はこれを試してください

これは他のすべての通貨でも機能します

$('#currencty-selectbox').on('change', function() {
selected = $(this).find(":selected");
$("div[class^=c]").eq(selected.index()).text(selected.text());
}).trigger("change");

デモ:

$('#currencty-selectbox').on('change', function() {
  selected = $(this).find(":selected");
   $("div[class^=c]").eq(selected.index()).text(selected.text());
}).trigger("change");
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id="currencty-selectbox">
    <option value="1">EUR</option>
    <option value="2">USD</option>
    <option value="3">JPY</option>
    <option value="4">CAD</option>
    <option value="5">MXN</option>
    <option value="6">CZK</option>
</select>


<div class='ccy'>currency 1</div>
<div class='ccy'>currency 2</div>

于 2015-05-14T09:18:36.513 に答える