正在验证选择框
Validating a select box
我想知道如何验证用户是否从我编码的选择框中选择了一个国家。
代码:
<label>Select a Country:
<br />
<select name="country">
<option selected disabled>Choose a Country</option>
<option value="United States">United States</option>
<option value="Canada">Canada</option>
<option value="Mexico">Mexico</option>
</select>
</label>
这个功能看起来像吗:
function validateCountry(){
if (form.country.value=="")
alert("Please Select a Country!");
form.country.focus();
return false;
}
- 您的
<select>
元素当前的默认值为"Choose a Country",因此您的if语句永远不会为true(没有值为== ''
的选项)。设置value
属性以更改该属性 - 未定义
form
。您可以使用多种方法选择表单,其中一个选项是document.querySelector()
。以下假设主题<select>
框是文档中第一个匹配的select[name="country"]
function validateCountry(){
var selectBox = document.querySelector('select[name="country"]');
if (selectBox.value==""){
alert("Please Select a Country!");
selectBox.focus();
return false;
}
}
document.getElementById('button').onclick = validateCountry;
<label>Select a Country:
<br />
<select name="country">
<option value='' selected disabled>Choose a Country</option>
<option value="United States">United States</option>
<option value="Canada">Canada</option>
<option value="Mexico">Mexico</option>
</select>
</label>
<button id='button'>Validate</button>
if( document.myForm.Country.value == "-1" )
{
alert( "Please provide your country!" );
return false;
}
也可以基于document.getElementById进行验证,只需在选择框中添加代码,id="country",
<label>Select a Country:
<br />
<select name="country" id="country">
<option value="">Choose a Country</option>
<option value="United States">United States</option>
<option value="Canada">Canada</option>
<option value="Mexico">Mexico</option>
</select>
</label>
<button id='submit' onclick="return validateCountry();">Validate</button>
function validateCountry() {
if(document.getElementById('country').value =='')
{
alert("Please select a country");
return false;
}
else
{
return true;
}
}
相关文章:
- 当与Dojo验证一起使用时,Chrome 41密码保存会做出错误的选择
- 单选按钮的验证(启用)&使用Jquery Optimization从复选框中选择submit按钮
- 如何创建只允许用户在选中前一个复选框的情况下选择复选框的复选框验证
- 带有动态选择选项的Firefox html5验证异常
- JQUERY 验证 - 序列化选择和复选框
- 我如何验证/发布编辑类型为表单编辑中的 jqgrid 选择的列
- 在应用 jQuery.Selected 时,使用 jQuery.Validate 来验证选择字段时,暴露错误
- 针对各种选择框更改验证单个表单的特定字段-jQuery
- 如何在不使用javascript和asp.net选择dropdownlist值的情况下显示验证
- 添加Jquery验证后,Jquery日期选择器无法工作
- 在AJAX提交之前使用jQuery进行多重下拉选择验证
- JavaScript 单选按钮选择验证字段
- 单选按钮选择验证
- ASP.Net:三个下拉菜单和使用javascript的出生日期选择验证
- Javascript/Jquery -不能让日期选择器+选择验证工作
- 使用jquery按值选择验证
- 已选择验证ddslick下拉值
- 剑道自动完成必须选择“验证”
- 单击“选择验证问题”(Firefox) 上的事件
- 根据单选按钮选择验证选中的复选框数