如何在另一個地點的選擇菜單中顯示選項標題

我試圖從選擇菜單中的選定選項中獲取標題屬性。我花了一天時間在這方面，我正在尋求幫助。我發現了幾種使用value屬性的方法，但現在我需要在頁面上的其他地方使用title屬性。如何在另一個地點的選擇菜單中顯示選項標題

這是我目前的嘗試，雖然我經歷了很多次迭代。我列出了兩個可能的腳本，儘管最終只會使用一個腳本。第一個可能的腳本可能包括Jquery，如果它可以在這裏使用，你可以把它翻譯成Javascript，因爲我不擅長？我是否按正確順序排列元素？

<select id="amount_id" onclick="function()"> 
<option value="" disabled="disabled">Amount</option> 
    <option value="0" title="None">0</option> 
    <option value="1" title="One Quarter">1/4</option> 
    <option value="2" title="One Half">1/2</option> 
    <option value="3" title="Three Quarters">3/4</option> 
    <option value="4" title="All">100%</option> 
</select> 
<textarea id="displayTitle"></textarea> 
<script> 
$(document).ready(function(){ 
    $(document).on('click','#amount_id',function(){ 
     var result = $("option:selected",this).attr('title'); 
     $("#displayTitle").text(result); 
    }); 
}); 
</script>

<script> 
function run(){ 
    document.getElementById("displayTitle").value = 
document.getElementById("amount_id").value;} 
</script>

謝謝。

來源

2017-08-12 landt5

檢查控制檯日誌：'的onclick = 「功能（）」'是給你一個錯誤。刪除它可以解決你的問題，因爲你的jQuery代碼不會被打破。我建議的唯一改變是聽'change'事件而不是'click'事件：從鍵盤下拉菜單中選擇值的用戶不會觸發click事件。 – Terry

嗨特里，你的帖子是我的頭。當傑克先生在他的帖子中刪除它時，我相信你是正確的。我很欣賞點擊與改變的教訓。感謝您的幫助。 – landt5

這是第一個代碼的一個JavaScript替代：

<select id="amount_id"> 
 
<!-- removed onclick --> 
 
<option value="" disabled>Amount</option> 
 
    <option value="0" title="None">0</option> 
 
    <option value="1" title="One Quarter">1/4</option> 
 
    <option value="2" title="One Half">1/2</option> 
 
    <option value="3" title="Three Quarters">3/4</option> 
 
    <option value="4" title="All">100%</option> 
 
</select> 
 
<textarea id="displayTitle"></textarea> 
 
<script> 
 
    document.getElementById("amount_id").addEventListener('change',function(){ 
 
    var eTitle = this.options[this.selectedIndex].getAttribute('title'); 
 
    document.getElementById("displayTitle").value = eTitle; 
 
    }); 
 
</script>

來源

2017-08-12 22:00:07

正是我需要的。你和特里非常善於幫助我。 – landt5

如何在另一個地點的選擇菜單中顯示選項標題

回答

相關問題