獲取點擊選項的ID

HTML: 
<select id="leftpane" size="10"> 
    <option id="1" value="one">One</option> 
    <option id="2" value="two">Two</option> 
</select> 

jQuery: 
$("#leftpane").click(function() { 
    alert(this.id); 
});

在上面的代碼中，如果我點擊一個項目，它將顯示「leftpane」選擇的ID。我想要的是被點擊的選項的ID。我可以很容易地得到的價值：獲取點擊選項的ID

alert($(this).val());

但我如何獲得點擊選項的ID？

來源

2013-05-29 Espen

我想你應該改用change事件;每當選擇了新的選項就被觸發：

$("#leftpane").on('change', function() { 
    var id = this.options[this.selectedIndex].id; 
});

裏面的事件處理程序，使用this.options[this.selectedIndex]找到所選<option>元素。

來源

2013-05-29 08:55:28

我喜歡這個，因爲它與this.options [this.selectedIndex] .id相同，並且不需要額外的jQuery選擇。不過，我會堅持點擊事件，因爲它是我想要的，即使更改事件給出了相同的結果。 – Espen

調整選擇器以選擇option s。這將導致事件處理程序被分配給選項而不是下拉菜單。

$("#leftpane option").click(function() { 
    alert(this.id); 
});

工作實例http://jsfiddle.net/hJdpV/

來源

2013-05-29 08:50:25

三種不同的答案。你的每個選項都有一個事件。任何優點/缺點？ – Espen

我相信其他人只是省略了事件處理程序。 –

是的，但暗示，就像我的原始代碼一樣，select標籤上只有一個事件處理程序，而不是每個選項標籤。我喜歡你的方式，因爲它非常直接，但每個選項標籤和事件處理程序都有數百個，我覺得可能在select標籤上有一個事件處理程序，並獲取像$（'：selected'，this）的id .prop （'id'）可能會更好。有什麼想法嗎？ – Espen

試試這個：

$("#leftpane option:selected").prop('id');

來源

2013-05-29 08:52:38

您可以使用以下代碼來獲取選定元素ID。

$("#leftpane").change(function(){ 
    $(this).find("option:selected").attr("id"); 
}); 

OR 

$("#leftpane").click(function(){ 
    $(this).find("option:selected").attr("id"); 
});

來源

2013-05-29 09:00:35 Tushar

this is working i have tried .......... 

` $(document).ready(function() { 
     $("#leftpane option").click(function() { 
     alert(this.id); 
      }); 
    }); `

來源

2013-05-29 09:10:35 user2427472

請試試這個:)

$("#leftpane option").click(function() { 
 
    var clickedOptText = $(this).text(); 
 
    alert(clickedOptText) 
 
});

$("#leftpane option").on("click",function(){ 
 

 
    var clickedText = $(this).text(); 
 
    alert(clickedText); 
 
    var clickedValue = $(this).value(); 
 
    alert(clickedValue); 
 

 
});

來源

2017-09-15 07:09:12

獲取點擊選項的ID

回答

相關問題