將複選框組處理爲字符串

我有一個表單，其中包含一組複選框。下面是HTML -將複選框組處理爲字符串

<input type="checkbox" name="p_contents[]" value="Value 1" /> 
<input type="checkbox" name="p_contents[]" value="Value 2" /> 
<input type="checkbox" name="p_contents[]" value="Value 3" /> 
<input type="checkbox" name="p_contents[]" value="Value 4" /> 
<input type="checkbox" name="p_contents[]" value="Value 5" />

我想用JavaScript來處理這一點 -

var contents; 
for(var i=0; i < document.forms['addForm'].elements['p_contents[]'].length; i++){ 
    if(i != (document.forms['addForm'].elements['p_contents[]'].length - 1)){ 
     if(document.forms['addForm'].elements['p_contents[]'].checked){ 
      contents += encodeURIComponent(document.forms['addForm'].elements['p_contents[]'][i].value) + ","; 
     } 
    }else{ 
     if(document.forms['addForm'].elements['p_contents[]'][i].checked){ 
      contents += encodeURIComponent(document.forms['addForm'].elements['p_contents[]'][i].value); 
     } 
    } 
}

我敢肯定，問題是枚舉：

document.forms['addForm'].elements['p_contents[]'][i].checked

這是正確的處理分組複選框表單的方式？

來源

2011-01-19 Dan Hanly

我會做這種方式：

var vals = [], p_contents = document.forms['addForm']['p_contents[]']; 
for(var i=0,elm;elm = p_contents[i];i++) { 
    if(elm.checked) { 
     vals.push(elm.value); 
    } 
}

，如果你需要得到的結果是一個字符串，只是做

vals.join(',');

如果需要encodeURIComponent，做推前值進入像這樣的vals數組：

vals.push(encodeURIComponent(elm.value));

所以回顧 - 如果您正在尋找完全相同的資源ULT自己的代碼是給予，而做到這一點：

var contents, vals = [], p_contents = document.forms['addForm']['p_contents[]']; 
for(var i=0,elm;elm = p_contents[i];i++) { 
    if(elm.checked) { 
     vals.push(encodeURIComponent(elm.value)); 
    } 
} 
contents = vals.join(',');

你可以看到它實際上這裏：http://jsfiddle.net/3MRc7/

來源

2011-01-19 13:50:11

我複製/粘貼此代碼並添加了警告（內容）;之後 - 警報沒有觸發：s – 2011-01-19 14:02:08

你有幾個同名的複選框。你不能通過名字輕鬆訪問它們。爲每個添加一個唯一的ID並使用document.getElementById()。請注意，form.elements[] is indexed by integer, not name, and scans through every element on a form。另外，如果您將一個長重複表達式分配給一個短名稱var，然後使用該短名稱，它會顯着提高代碼的可讀性。

來源

2011-01-19 13:47:04 9000

在您提供的示例中，不需要爲每個複選框添加唯一的ID。 – niksvp 2011-01-19 13:52:59

按規定由@ 9000，你可以做同樣的加元ID並遍歷它下面的方式

for (i = 0; i < length; i++) { //you can calculate length as you did before or any alternate way 
    var prefix = 'yourPrefixToId'; 
    if (document.getElementById(prefix + i).checked) { 
    // do stuff 
    } 
}

來源

2011-01-19 14:07:27 niksvp

將複選框組處理爲字符串

回答

相關問題