在div中加載JavaScript後更改HTML代碼

我有一個從DB獲取值的頁面，我無法控制值/它們如何被調用，但最終結果看起來像標準HTML代碼，例如：在div中加載JavaScript後更改HTML代碼

<div id="myDiv" class="controls"> 
    <select id="jform_province" name="jform[province]"> 
     <option value="AB">Alberta</option> 
     <option value="BC">British Columbia</option> 
     <option value="MB">Manitoba</option> 
    </select> 
</div>

我希望把一個腳本在那可以修改比如說增加一個功能選項元素的頁的末尾，以便它看起來像這樣：

<option value="AB" onClick="someFunction()">Alberta</option>

我如何可以修改代碼？我知道如何編輯div的全部內容，但我想更改元素，我不知道元素的值是什麼，因此腳本需要在「myDiv」中查找所有選項標記（我在其他列表中頁面我不想更改）並將其添加到所有這些代碼。

感謝

來源

2013-02-04 Mankind1023

只是附加一個事件處理程序：

document.getElementById('jform_province').onchange = function() { 
    switch(this.options[this.selectedIndex].value) { 
    case "AB": someFunction(); break; 
    // define other cases as needed 
    } 
};

注意，選擇時<option>元素不火onclick事件，即使他們並不會檢測替代輸入方法，例如使用鍵盤。上面的代碼提供了另一種選擇。

來源

2013-02-04 22:55:02

該列表確實可以在點擊上工作，但不是在按鍵上，所以您是對的，但問題是我並不總是知道選項會是什麼，在其他情況下它不可行（有數百個選項），有沒有辦法自動化呢？如果我選擇的功能不管選擇哪個選項，我該怎麼寫呢？像案例（全部） – Mankind1023

然後只是不要把'switch'放在那裏，只需調用函數即可。 –

謝謝，這很好，唯一的是我需要從下拉列表中選項卡更新，但沒關係。 – Mankind1023

在div中加載JavaScript後更改HTML代碼

回答

相關問題