在Javascript中访问HTML表单的值

时间:2013-06-13 14:42:43

标签: javascript html

我是Javascript的新手,我无法弄清楚为什么这段代码不能按照我认为应该的方式运行。

这是我的Javascript代码。所有我想做的(现在)都是从这些文本框中取值并下拉,然后将它们连接起来。

<script>
function AdvancedSearch () {
var color = document.getElementByID("AdvSearchColor").value;
var ply = document.getElementByID("AdvSearchPly").value;
var cat = document.getElementByID("AdvSearchCategory").value;
var size = document.getElementByID("AdvSearchSize").value;
var description = document.getElementByID("AdvSearchDescription").value;
var fullsearch = ply + color + cat + description + size;
}
</script>    

<form id="advsearach" onsubmit="AdvancedSearch()">
Product Color: <input type="text" name="productcolor" id="AdvSearchProductColor"><br>
Product Ply Rating: <input type="text" name="productply" id="AdvSearchPlyRating"><br>
Product Category: <input type="text" name="productcategory" id="AdvSearchProductCategory"><br>
Product Size: <input type="text" name="productsize" id="AdvSearchProductSize"><br>
Product Description: <input type="text" name="productdescription" id="AdvSearchProductDescription"><br>
<input type="button" onclick="javascript:AdvancedSearch()" value="Search!">
</form> 

所以我在解决这些问题时遇到了麻烦,只是调试它并让它运行起来。花了几个小时就已经开始了......感谢任何花时间看这个的人,从长远来看,它可能会节省很多时间,这是一件非常好的事情。

1 个答案:

答案 0 :(得分:2)

您应该使用document.getElementById代替document.getElementByID。有一个错字"Id" != "ID"。 并且您的表单的ID必须与javascript形式的那些匹配o.O

<form id="advsearach">
    Product Color: <input type="text" name="productcolor" id="AdvSearchColor"><br>
    Product Ply Rating: <input type="text" name="productply" id="AdvSearchPly"><br>
    Product Category: <input type="text" name="productcategory" id="AdvSearchCategory"><br>
    Product Size: <input type="text" name="productsize" id="AdvSearchSize"><br>
    Product Description: <input type="text" name="productdescription" id="AdvSearchDescription"><br>
    <input type="button" onclick="javascript:AdvancedSearch()" value="Search!">
</form> 

<script>
function AdvancedSearch () {
    var color = document.getElementById("AdvSearchColor").value,
        ply = document.getElementById("AdvSearchPly").value,
        cat = document.getElementById("AdvSearchCategory").value,
        size = document.getElementById("AdvSearchSize").value,
        description = document.getElementById("AdvSearchDescription").value,
        fullsearch = ply + color + cat + description + size;
    console.log(fullsearch);
}
</script>