2017-07-28 76 views
-3

我有一個非常基本的問題。我想從下拉列表中選擇SELECTED文本和下拉列表並在警告框中顯示。如何從Javascript中的下拉列表中獲取文本和值

我嘗試:

下拉

<p id="test"> 
    Select a draft: 
    <select id="Select" name="Select"> 
    <option value="1">One</option> 
    <option value="2">Two</option> 
    <option value="3">Three</option> 
    </select> 
</p> 

JS

$("#Select").change(function() 
{ 
    alert($(this).val()); // IF THIS WORKS FINE THEN NEXT LINE CODE SHOULD WORK TOO 
    alert($(this).text()); // WHY THIS SHOWS ALL THE DROPDOWN TEXTS 
    alert($("#Select option:selected").text()); // THIS JUST WORKS FINE 
}); 

問題1:什麼$(這)表示?如果它表示選定的元素,那麼它應該在做$(this).text()時顯示文本。但它不能按預期工作。

問題2:如果我需要選擇值和上面提到的下拉列表的文本是有效的方法去解決它。

請指導我。

My JSFIDDLE Attempt

+0

'$(本)'是選擇本身不是所選的選項 – sTx

+0

爲什麼反對票。我已經添加了我的小提琴嘗試,也添加了我的疑惑 – Unbreakable

+0

不,$(「this」)將所有名爲「this」的DOM元素都定位到不存在的位置。你當然意味着$(本) – Salketer

回答

3

在你change事件處理程序,$(this)<select>元素。

$(this)代表的元素取決於使用它的上下文。
例如,它通常是觸發事件的元素(如此處)或.each()循環的迭代所針對的元素。

當選擇一個<option>,在<select>採取其選擇的選項值作爲值...
它不所選選項的文本做到這一點。

所以這就是爲什麼第二個alert()聲明不起作用。

+1

接受您的答案,因爲這一行'當選擇