動態更改選擇值

Question

我需要在選擇列表中獲取所選選項（如果已更改）的值，並更改選擇列表旁邊的範圍中的文本。問題是我不知道選擇列表的ID。頁面上有很多不同的選擇列表（5-25 +），它們都是動態創建的，所以我不能在.change()中指定id。以下是我有：

的JavaScript：

$("select").change(function() { 
    var str = ""; 
    str = $("select option:selected").text(); 

    $(".out").text(str); 
}).trigger('change'); 

（當然，這並不工作，將所有選擇值的每個跨度）

HTML：

<select name="animal[]"> 
    <option value="dog">dog</option> 
    <option value="cat">cat</option> 
    <option value="bird">bird</option> 
    <option value="snake">snake</option> 
</select> 
<span class="out"></span> 

我錯過了什麼？

Answer 1

嘗試是這樣的：

$("select").change(function() { 
    var txt = $(this).val(); 
    $(this).next('span.out').text(txt); 
}).trigger('change');​ 

Answer 2

聽起來像是你想使用jQuery的next

Answer 3

試試這個：

$("select").each(function(){ 

    var select = $(this), 
     out = select.next(); 

    select.change(function() { 
     out.text(select.val()); 
    }); 

}).trigger('change'); 

Answer 4

你可以得到事件回調中使用$(this)變更過的要素。嘗試改變線

str = $("select option:selected").text(); 

到

str = $(this).find("option:selected").text(); 

Answer 5

試試這個：

$("select").change(function() { 
    var str = ""; 
    str = $(this).find(":selected").text(); 

    $(".out").text(str); 
}).trigger('change');