Firefox不支持JavaScript（表单验证），但IE完全支持(Firefox does not support JavaScript (form validation) but IE full

Firefox不支持JavaScript（表单验证），但IE完全支持(Firefox does not support JavaScript (form validation) but IE fully support)

这是我的代码：

function validateFormOnSubmit2(theForm) { var reason = ""; reason += validateState(theForm.state); if (reason != "") { alert("State field need correction:\n" + reason); return false; } return true; } function validateState(fld) { var error = ""; if (fld.value == "") { error = "Please Select State.\n"; fld.style.background = 'Yellow'; } return error; }

当我点击提交按钮时调用此函数。

<form id="form2" name="form2" method="post" action="state_results.php" onsubmit="return validateFormOnSubmit2(this)"> <select name="state" id="state"> <option selected="selected">Select State...</option> <option value="Alabama">Alabama</option> <option value="Alaska">Alaska</option> <option value="Arizona">Arizona</option> <option value="Arkansas">Arkansas</option> <option value="California">California</option> <option value="Colorado">Colorado</option> <option value="Connecticut">Connecticut</option> <option value="Delaware">Delaware</option> <option value="Florida">Florida</option> <option value="Georgia">Georgia</option> <option value="Hawaii">Hawaii</option> <option value="Idaho">Idaho</option> <option value="Illinois">Illinois</option> <option value="Indiana">Indiana</option> <option value="Iowa">Iowa</option> <option value="Kansas">Kansas</option> <option value="Kentucky">Kentucky</option> <option value="Louisiana">Louisiana</option> <option value="Maine">Maine</option> <option value="Maryland">Maryland</option> <option value="Massachusetts">Massachusetts</option> <option value="Michigan">Michigan</option> <option value="Minnesota">Minnesota</option> <option value="Mississippi">Mississippi</option> <option value="Missouri">Missouri</option> <option value="Montana">Montana</option> <option value="Nebraska">Nebraska</option> <option value="Nevada">Nevada</option> <option value="New Hampshire">New Hampshire</option> <option value="New Jersey">New Jersey</option> <option value="New Mexico">New Mexico</option> <option value="New York">New York</option> <option value="North Carolina">North Carolina</option> <option value="North Dakota">North Dakota</option> <option value="Ohio">Ohio</option> <option value="Oklahoma">Oklahoma</option> <option value="Oregon">Oregon</option> <option value="Pennsylvania">Pennsylvania</option> <option value="Rhode Island">Rhode Island</option> <option value="South Carolina">South Carolina</option> <option value="South Dakota">South Dakota</option> <option value="Tennessee">Tennessee</option> <option value="Texas">Texas</option> <option value="Utah">Utah</option> <option value="Vermont">Vermont</option> <option value="Virginia">Virginia</option> <option value="Washington">Washington</option> <option value="West Virginia">West Virginia</option> <option value="Wisconsin">Wisconsin</option> <option value="Wyoming">Wyoming</option> </select> <input name="submit2" type="submit" id="submit2" value="Search!" />

this is my code:

function validateFormOnSubmit2(theForm) { var reason = ""; reason += validateState(theForm.state); if (reason != "") { alert("State field need correction:\n" + reason); return false; } return true; } function validateState(fld) { var error = ""; if (fld.value == "") { error = "Please Select State.\n"; fld.style.background = 'Yellow'; } return error; }

call this function when i click on submit button.

<form id="form2" name="form2" method="post" action="state_results.php" onsubmit="return validateFormOnSubmit2(this)"> <select name="state" id="state"> <option selected="selected">Select State...</option> <option value="Alabama">Alabama</option> <option value="Alaska">Alaska</option> <option value="Arizona">Arizona</option> <option value="Arkansas">Arkansas</option> <option value="California">California</option> <option value="Colorado">Colorado</option> <option value="Connecticut">Connecticut</option> <option value="Delaware">Delaware</option> <option value="Florida">Florida</option> <option value="Georgia">Georgia</option> <option value="Hawaii">Hawaii</option> <option value="Idaho">Idaho</option> <option value="Illinois">Illinois</option> <option value="Indiana">Indiana</option> <option value="Iowa">Iowa</option> <option value="Kansas">Kansas</option> <option value="Kentucky">Kentucky</option> <option value="Louisiana">Louisiana</option> <option value="Maine">Maine</option> <option value="Maryland">Maryland</option> <option value="Massachusetts">Massachusetts</option> <option value="Michigan">Michigan</option> <option value="Minnesota">Minnesota</option> <option value="Mississippi">Mississippi</option> <option value="Missouri">Missouri</option> <option value="Montana">Montana</option> <option value="Nebraska">Nebraska</option> <option value="Nevada">Nevada</option> <option value="New Hampshire">New Hampshire</option> <option value="New Jersey">New Jersey</option> <option value="New Mexico">New Mexico</option> <option value="New York">New York</option> <option value="North Carolina">North Carolina</option> <option value="North Dakota">North Dakota</option> <option value="Ohio">Ohio</option> <option value="Oklahoma">Oklahoma</option> <option value="Oregon">Oregon</option> <option value="Pennsylvania">Pennsylvania</option> <option value="Rhode Island">Rhode Island</option> <option value="South Carolina">South Carolina</option> <option value="South Dakota">South Dakota</option> <option value="Tennessee">Tennessee</option> <option value="Texas">Texas</option> <option value="Utah">Utah</option> <option value="Vermont">Vermont</option> <option value="Virginia">Virginia</option> <option value="Washington">Washington</option> <option value="West Virginia">West Virginia</option> <option value="Wisconsin">Wisconsin</option> <option value="Wyoming">Wyoming</option> </select> <input name="submit2" type="submit" id="submit2" value="Search!" />

最满意答案

我认为问题是<select>元素在所有浏览器中都没有value属性。

但是，您可以向<select>元素询问其选定的索引及其选项。 尝试这样的事情：

function validateState(fld) { var error = ""; var value = fld.options[fld.selectedIndex].value; if (value == "") { error = "Please Select State.\n"; fld.style.background = 'Yellow'; } return error; }

此外，您应该确保第一个选项“Select State ...”具有value属性，并将其设置为空字符串：

<option selected="selected" value="">Select State...</option>

I believe that the problem is that <select> elements do not have a value attribute in all browsers.

You can, however, ask the <select> element for its selected index, and for its options. try something like this:

function validateState(fld) { var error = ""; var value = fld.options[fld.selectedIndex].value; if (value == "") { error = "Please Select State.\n"; fld.style.background = 'Yellow'; } return error; }

In addition, you should be sure that the first option "Select State..." has a value attribute, and set it to the empty string:

<option selected="selected" value="">Select State...</option>