![](/img/trans.png)
[英]How to have text fields hidden by default on page load until the relevant drop down option has been selected?
[英]Verify that an Option has been Selected in a Drop Down Box
在http://www.greekforme.com/999-apron-01.html上 ,有几个下拉框。
如果用户未更改“选择以下选项”中的下拉菜单,则称为“ verifyselection”的脚本应该显示一个弹出框。
function verifyselection(form)
{
// result function
var blnResult = true;
// temp name form control
var nameControl = "";
// array of name of radio form controls
var arrNameControl = new Array();
// array of value checked of radio form controls
var arrValueControl = new Array();
// flag existence form control in array
var isExistOnArray = false;
// loop on all elements of form
for(i=0; i<form.elements.length; i++) {
// check type form control
if(form.elements[i].type=="radio") {
// save name form control
nameControl = form.elements[i].name;
// reset flag existence form control in array
isExistOnArray = false;
// loop on all found radio form control
for(j=0; j<arrNameControl.length; j++){
// if giving form control is exist in array
if(arrNameControl[j] == nameControl) {
// set flag
isExistOnArray = true;
// break loop
break;
}
}
// if giving form control is not exist in array
if(isExistOnArray == false){
// set index of array
j = arrNameControl.length;
// add new element to arrays
arrNameControl[j] = nameControl;
arrValueControl[j] = 0;
}
// if giving radio form control is checked
if(form.elements[i].checked == "1"){
arrValueControl[j] = 1;
}
}
if ((form.elements[i].selectedIndex > -1)) {
if (form.elements[i].selectedIndex == 0) {
var opttext = form.elements[i].value.toLowerCase();
if (opttext.indexOf('optional') < 0) {
blnResult = false;
alert('Please select one of the options from the list');
break;
}
}
}
}
// loop on all found radio form control
if(blnResult==true) {
for(j=0; j<arrNameControl.length; j++){
// if radio group form control is checked
if(arrValueControl[j] != 1) {
// set result function
blnResult = false;
// show error message
alert('Please select one of the options from the list');
break;
}
}
}
// return result function
return blnResult;
}
当前,当您单击“添加到购物车”按钮时,我可以显示弹出框-
但是...它仍然将项目添加到购物车。
如果用户不更改“选择以下选项”中的下拉菜单,我希望脚本阻止该项目添加到购物车
您从哪里调用此函数? 如果在onsubmit处理程序中,则该处理程序应返回false。 因此,您应该在代码中的某处:
form.onsubmit = function() {
return verifyselection(this);
}
或者,在html中:
<form onsubmit="return verifyselection(this);" ...>
这里重要的是return
部分。 当处理程序返回false
,将不执行默认操作。 在这种情况下,表单将不会提交。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.