創建onClick屬性選項

這是一個想法：當我點擊「word1」（或「word2」）時，選擇標籤會顯示選項。一旦我點擊其中一個選項，我的腳本就會改變選項「word1」（或「word2」）。我可以更新選項，但是一旦我點擊其中的一個腳本，就會寫出最後一個選項。該腳本寫的所有選項相同的onClick屬性... 我一直在尋找很多，但我不明白爲什麼會發生，以及如何解決它。創建onClick屬性選項

下面是代碼：

function updatemyselect(currentElement, optionsList) { 
 
    var mySelect = document.getElementById("mySelect"); 
 
    var i; 
 

 
    //Clear the options 
 
    mySelect.options.length = 0; 
 

 
    //Add the options 
 
    for (i = 0; i < optionsList.length; i++) { 
 
    var option = document.createElement("option"); 
 
    var newWord = optionsList[i] 
 
    option.text = newWord; 
 
    option.onclick = function() { 
 
     currentElement.innerHTML = newWord; 
 
    }; 
 
    mySelect.add(option); 
 
    } 
 

 
}

<select id="mySelect"> 
 
</select> 
 

 

 
<p onclick="updatemyselect(this,['Dog','Cat','Fish'])" class="changedWord">Word1</p> 
 

 
<p onclick="updatemyselect(this,['Cow','Horse','Whale'])" class="changedWord">Word2</p>

在此先感謝

來源

2015-02-24 TTK

我認爲你必須使用上選擇的onchange屬性來執行你的行動 – Genosite 2015-02-24 15:20:36

謝謝，我解決了使用onchange屬性 – TTK 2015-02-25 23:07:47

您無法在「選擇框」的「選項」屬性上綁定「點擊事件」。您將需要綁定'選擇元素'上的onchange事件列表程序。在更改事件列表程序的回調函數中，放置了用於更新單詞文本的代碼邏輯。由於'change'事件列表器不在'updatemyselect'函數的範圍內，因此可以將最後一次單擊的元素存儲在變量中，並在回調函數中使用該元素來更新所需的單詞文本。請參閱我編輯過的下面的代碼。

var clickedElement; 
 
function updatemyselect(currentElement, optionsList) { 
 
    clickedElement = currentElement; 
 
    var mySelect = document.getElementById("mySelect"); 
 
    var i; 
 

 
    //Clear the options 
 
    mySelect.options.length = 0; 
 

 
    //Add the options 
 
    for (i = 0; i < optionsList.length; i++) { 
 
    var option = document.createElement("option"); 
 
    var newWord = optionsList[i] 
 
    option.text = newWord; 
 
    /*option.onclick = function() { 
 
     currentElement.innerHTML = newWord; 
 
    };*/ 
 
    mySelect.add(option); 
 
    } 
 
} 
 

 
document.getElementById("mySelect").addEventListener("change", updatePTag); 
 

 
function updatePTag(){ 
 
    clickedElement.innerHTML = this.value; 
 
    };

<select id="mySelect"> 
 
</select> 
 

 

 
<p onclick="updatemyselect(this,['Dog','Cat','Fish'])" class="changedWord">Word1</p> 
 

 
<p onclick="updatemyselect(this,['Cow','Horse','Whale'])" class="changedWord">Word2</p>

來源

2015-02-24 16:21:56 Arun

您絕對可以將點擊事件綁定到選項。這是最好的方法嗎？沒有（當然可以），但它確實有效。他只需要正確地獲得選項的價值。 – talemyn 2015-02-24 17:07:39

首先，你需要設置每個選項的值屬性。

您可以在Select上使用onChange事件來顯示您的值。

您可以使用jQuery來做到這一點，它更容易 jquery select change event get selected option

來源

2015-02-24 15:27:56 Genosite

1）如果沒有'爲value'屬性的'

創建onClick屬性選項

回答