跨度

Question

的內部文本，選擇菜單中我有一個選擇下拉

<select id="select_domain"> 
    <option value="1">Jon Doe</option> 
    <option value="2">Max Mustermann</option> 
    </select> 

一虎口

<span id="domain"></span> 

這個跨度裏面應該有我的選擇菜單中選擇選項的文本。

我該如何做到這一點與jQuery？

Answer 1

可能這就是你所期待的：

$("#select_domain").on("change", function() { 
 
    $("#domain").text($("#select_domain option:selected").text()); 
 
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<select id="select_domain"> 
 
    <option value="1">Jon Doe</option> 
 
    <option value="2">Max Mustermann</option> 
 
</select> 
 
<span id="domain"></span>

Answer 2

請檢查這個答案，

$(function() { 
    $('#select_domain').change(function(){ 
     $("#domain").text($("#select_domain option:selected").text()); 
    }); 
}); 

Answer 3

你可以用它來獲取文本：

$("#select_domain option:selected").text(); 

，並獲得價值：

$("#select_domain").val() 

的jsfiddle：http://jsfiddle.net/ghorg12110/eqd22pca/1/

Answer 4

的「時」是一種很重要的，但如果你希望你的跨度，當你選擇一個新的值更新，使用是這樣的：

$("#select_domain").change(function() { 
     $('#domain').html($('select_domain').val()); 
    }); 

如果你想要的默認值在負荷跨度展現，你可以做到這一點與你的服務器端代碼或該行添加到您的泛型函數：

$('#domain').html($('select_domain').val()); 

Answer 5

下面是一個解釋的示例，以及在頁面加載時觸發事件的額外效果。

/*Binds a change event to your select*/ 
 
$('#select_domain').change(function() { 
 
    /*sets the text to the selected option of THIS select box*/ 
 
    set_text($('option:selected', this).text()); 
 
}); 
 
/*Creates a function to set the text of domain 
 
This function can be used elsewhere as well*/ 
 
function set_text(text){ 
 
    $('#domain').text(text); 
 
} 
 

 
/*This triggers the function and sets the text 
 
to the currently selected text on page load*/ 
 
set_text($('#select_domain option:selected').text());

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<select id="select_domain"> 
 
    <option value="1">Jon Doe</option> 
 
    <option value="2">Max Mustermann</option> 
 
</select> 
 
<span id="domain"></span>