Javascript使用class而不是id

时间:2012-11-04 14:49:31

标签: javascript

我有下面的代码,因为它没有验证我想从输入框中删除id并使Javascript使用类(class =“filterCat”)而不是id。我该怎么做?

感谢。

<form id="adv_searchform" action="/" method="get" name="adv_searchform" onsubmit="return manageMultipleCategoriesSearch()">
  Search: 
  <input id="adv_s" class="input input_large" type="text" name="s" value="" />
  <h3>Category filter:</h3>
  <ul id="catSearchFilters">
<li><input type="checkbox" id="filterCat" class="filterCat" value="38">Announcements</li>
<li><input type="checkbox" id="filterCat" class="filterCat" value="39">Commentary</li>
<li><input type="checkbox" id="filterCat" class="filterCat" value="1">Uncategorized</li></ul>  <div class="clear"></div>
  <input type="hidden" name="cat" value="" />
  <input type="submit" id="searchsubmit" value="Search" />
</form>

<script>
function manageMultipleCategoriesSearch(){

  var selectedCats = "";
  var isFirst = true;

  for (i=0; i<document.adv_searchform.filterCat.length; i++){
    if (document.adv_searchform.filterCat[i].checked == true){

    if (!isFirst)
      selectedCats += ',';

      selectedCats += document.adv_searchform.filterCat[i].value;
      isFirst = false;
    }
  }

  document.adv_searchform.cat.value = selectedCats;

  return true;
}
</script>

2 个答案:

答案 0 :(得分:1)

使用name而不是id。你应该为不同的复选框使用不同的名称。

<li><input type="checkbox" name="filterCat1" class="filterCat" value="38">Announcements</li>
<li><input type="checkbox" name="filterCat2" class="filterCat" value="39">Commentary</li>
<li><input type="checkbox" name="filterCat3" class="filterCat" value="1">Uncategorized</li></ul>  <div class="clear"></div>

JS

var check = document.getElementsByClassName("filterCat");
for (i=0; i<check .length; i++){
    if (check[i].checked == true){

    if (!isFirst)
      selectedCats += ',';

      selectedCats += check [i].value;
      isFirst = false;
    }
  }

答案 1 :(得分:0)

使用:

document.getElementsByClassName('filterCat')