2011-04-26 71 views
0

我試圖更改名稱爲「make」或「model」的數組列表中的所有字段。我確信我沒有做一些簡單的工作。但是下面的這個函數不起作用。如何更改數組列表中多個字段的類名稱?Javascript - 使用數組更改類名稱

CSS 
hide { 
display: none; 
} 

array = ['make','model']; 

function deactivateField(array) { 
    count = array.length; 
    for (i = 0; i < count; i++) { 
     array[i].className = 'hide'); 
    } 
} 


<td id="make" name="make" class="show">aaa</td> 
<td id="make" name="make" class="show">bbb</td> 
<td id="make" name="make" class="show">ccc</td> 

<td id="model" name="model" class="show">111</td> 
<td id="model" name="model" class="show">222</td> 
<td id="model" name="model" class="show">333</td> 

回答

0

這裏就是我得到了這個工作:

function deactivateField(field_array) { 
    cnt = field_array.length; 
    for (a = 0; a < cnt; a++) { 
     changeClassByName(field[a], 'hide'); 
    } 
} 

function changeClassByName(name, classname) { 
    var nm = document.getElementsByName(name); 
    count = nm.length; 
    for(b = 0; b < count; b++){ 
     nm[b].className = classname; 
    } 
} 
0

首先,在HTML頁面中不能有多個具有給定ID的元素。

其次,當你做

array[i].className = 'hide' 

你所要求的屬性從陣列拍攝的字符串className;相當於做"make".className。自然,這是行不通的。你的意圖是找到具有id或名稱「make」的元素,然後更改該元素的className,而不是單詞「make」。

如果你真的是通過獨特的ID數組,那麼你可以做

for (i = 0; i < count; i++) { 
    var el = document.getElementById(array[i]); 
    el.className = 'hide'); 
} 

但同樣,這需要每一個元素都有其自身獨特的ID。

0

我的答案假設你會給每個元素一個唯一的ID(因爲這是無效的),並且名稱屬性的值將保持不變。

function deactivateField(array) { 
    var i = 0, j = 0, elements; 
    elements = document.getElementsByTagName("td"); 
    for (; i< elements.length; i++) { 
     for (; j<array.length; j++) { 
     if (elements[i].name === array[j]) { 
      elements[i].className = "hide"; 
     } 
     } 
    } 
} 
0

首先,「id」意思是獨特的。用jQuery你可以做到這一點(未經測試)。我不知道了手,如果jQuery將嘗試處理多個元素具有相同的「ID」:

array = ['make','model']; 
function deactivateField(array) { 
    count = array.length; 
    for (i = 0; i < count; i++) { 
     $('#' + array[i]).removeClass('show').addClass('hide'); 
    } 
} 
0

首先,你不能有相同ID的多個元素。 Id的意思是獨一無二的。此外,您擁有的數組實際上並沒有引用任何元素,它只是一個字符串數組。您將需要使用諸如document.getElementsByTagName之類的選擇器來獲取一組選擇器(因爲IE不支持getElementsByClassName),然後遍歷它們以獲取具有所需類的元素。

array = ['make','model']; 
elArray = document.getElementsByTagName("td") 
function deactivateField(array) { 
    count = elArray.length; 
    for (i = 0; i < count; i++) { 
     for(x = 0; x < array.length; x++) 
     { 
      if(array[x].test(elArray[i])) 
      { 
        elArray[i].className = array[x] + " hide"; 
      } 
     } 
    }   

<td name="make" class="make show">aaa</td> 
<td name="make" class="make show">bbb</td> 
<td name="make" class="make show">ccc</td> 

<td name="model" class="model show">111</td> 
<td name="model" class="model show">222</td> 
<td name="model" class="model show">333</td> 
0

數組不包含元素本身,只包含對應於所需id的字符串。保持唯一的ID。然後使用DOM爲了得到節點:document.getElementById('idName');。然後,你將能夠操縱實際的元素。

另一件事,CSS應該是.hide,因爲hide試圖找到這樣的標籤。