0

如何将 div 文本更改为 Selectbox 选项选定的文本...

我有一个包含 100 多个值的选择框

场景： 一旦我从选择框中选择一个选项，相同的选项值（文本）必须被它具有ccy类<div class="ccy">blablabla</div>类的相关 div 文本替换......

例如：我有一个带有欧元、美元、日元、印度卢比等的选择框...如果我从选择框中选择欧元， 则应将具有 ccy 类的相关 div<div class='ccy'>currency 1</div><div class='ccy'>currency 2</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 回答
1

这是解决方案：https://jsfiddle.net/ts0L5xej/ 您可以通过在change事件处理程序中添加以下内容来做到这一点。

   $('.ccy').text($(this).find(":selected").text());
于 2015-05-14T09:19:55.037 回答
1

只是trigger事件change并放置文本。

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

工作演示

于 2015-05-14T09:20:17.130 回答
1

要更改 te div 中的值，请使用您使用的相同 text() 方法，但使用类似的值$('.ccy').text('some new text')

检查这个FIDDLE更新的代码。

于 2015-05-14T09:23:30.153 回答
0 
 $(".ccy").text($(this).find(":selected").text());

jsfiddle

于 2015-05-14T09:20:31.860 回答