如何使用getElementsByClassName？

-1

嘿，我使用getElementByClassName時出錯。我的意圖是，我想改變多個文本的顏色，從下拉列表中選擇一個選項，其中每個選項具有不同的顏色。如何使用getElementsByClassName？

在這裏，我已經爲所有文本分配了一個className。

這是我的代碼。

<html> 
    <head> 
     <script type="text/javascript"> 
     function copyText(selectedElement) { 
      var className = document.getElementsByClassName("incomeTypeSalary"); 
      for (i = 0; i < className.length; i++) 

      { 
       className[i].style.color = selectedElement.options[selectedElement.selectedIndex].style.color; 
      } 

     } 
     </script> 
    </head> 

    <body> 
     <div style="width:600px;border:1px solid black;float:left"> 
     <select width="200px" id="selectedElement" onclick="copyText(selectedElement)"> 
      <option style="color:red">Theta Saving Plan</option> 
      <option style="color:green">Roth Plan</option> 
      <option style="color:yellow">IRG Plan</option> 
      <option style="color:PINK">II Plan</option> 
     </select> 
     </div> 
     <div style="width:300px;border:1px solid black;float:left"> 
     <span style="padding-top:30px;font-size:24px;font-family:arial:" class="incomeTypeSalary">Contribution</span> 
     <table style="padding-top:24px"> 
      <tr> 
       <td> 
        <span class="incomeTypeSalary">Annual Salary</span> 
       </td> 
       <td> 
        <input type="text" style="width:81px; direction:rtl;"> 
       </td> 
      </tr> 
      <tr> 
       <td> 
        <span class="incomeTypeSalary2">Annual Coomission</span> 
       </td> 
       <td> 
        <input type="text" style="width:81px; direction:rtl;"> 
       </td> 
      </tr> 
      <tr> 
       <td> 
        <span class="incomeTypeSalary3">Annual Bonus</span> 
       </td> 
       <td> 
        <input type="text" style="width:81px; direction:rtl;"> 
       </td> 
      </tr> 
     </table> 
     </div> 
    </body> 
</html>

PLs help me.Thanks in Advance。

來源

2012-04-15 Snehal Kumar Mishra

請貼你的錯誤的情況 – UVM 2012-04-15 06:35:24

標題：'getElementByClassName' - >'getElementsByClassName方法' – 2012-04-15 06:37:42

更改onclick到onchange

http://jsfiddle.net/wQWdg/

這會爲所有的瀏覽器工作

function getElementsByClassName(className) { 
    if (document.getElementsByClassName) { 
     return document.getElementsByClassName(className); 
    } 
    else { 
     return document.querySelectorAll('.' + className); 
    } 
}

來源

2012-04-15 06:44:46

嘿謝謝我試過你說.... Bt它仍然工作..色彩不是反射回文本 – 2012-04-15 07:34:05

檢查工作示例的鏈接 – 2012-04-15 07:39:27

嘿對不起，但我已經嘗試了上述鏈接在IE8和Firefox中，但它不工作.. – 2012-04-15 07:48:20

如何使用getElementsByClassName？

回答

相關問題