很基本的JavaScript验证,在这里记录一下方便以后取用。单选按钮和上传文件是非常常见的,很多时候当这两个控件用户并没有使用的情况下,不允许用户执行下一步操作。下面将一下如何实现。
先是单选按钮吧:
<label><input type="radio" name="work_group" id="" class="radio" value="少儿组">少儿组</label> <label><input type="radio" name="work_group" id="" class="radio" value="青年组">青年组</label> <label><input type="radio" name="work_group" id="" class="radio" value="中青年组">中青年组</label> <label><input type="radio" name="work_group" id="" class="radio" value="老年组">老年组</label>
当单选按钮没有被选中的时候,禁止用户Post与Get数据。
var flag=false;
for(i=0; i<form.work_group.length; i++)
if(form.work_group[i].checked)
{
flag = true;
//break;
}
然后是上传文件,HTML如下:
<input type="file" name="work1" id="work1" class="fileupload"> <span id="addFile">添加文件</span>
JavaScript如下:
// 文件上传
var file = document.getElementById("work1").value;
if(file == null || file == ""){
alert("请选择上传的图片");
return(false);
}
return(true);
完整的js代码:
<script type="text/javascript">
function chkinput(form)
{
//组别
var flag=false;
for(i=0; i<form.work_group.length; i++)
if(form.work_group[i].checked)
{
flag = true;
//break;
}
if(!flag) {
alert("请选择作品组别");
return flag;
}
// 验证输入框
if(form.name.value=="")
{
alert("请输入姓名");
form.name.select();
return(false);
}
if(form.tel.value=="")
{
alert("请输入电话");
form.tel.select();
return(false);
}
if(form.id_card.value=="")
{
alert("请输入身份证号码");
form.id_card.select();
return(false);
}
if(form.work_name.value=="")
{
alert("请输入作品名称");
form.work_name.select();
return(false);
}
if(form.place.value=="")
{
alert("请输入摄影地点");
form.place.select();
return(false);
}
// 文件上传
var file = document.getElementById("work1").value;
if(file == null || file == ""){
alert("请选择上传的图片");
return(false);
}
return(true);
}
</script>
Form的属性可以参考下面
<form method="post" enctype="multipart/form-data" action="includes/upload.php" onSubmit="return chkinput(this)"> </form>