1、表单判文本框空
表单文本框:
<input id="orgName" type="text" name="" value=""/>
判空的JavaScript代码:
var orgName = document.getElementById("orgName").value;
if(orgName.replace(/(^\s*)|(\s*$)/g, "") == "") {
alert("组织机构名称不能为空!");
return false;
}
说明:
正则表达式(/(^\s*)|(\s*$)/g, "") 的含义如下:
\s表示所有空字符: 空格, 回车等等
/g表示全局
^表示开始
*表示0到无数个
$表示结束
整个正则表达式的含义就是, 将所有空字符替换成 ""。
2、表单下拉列表框select中选中的option的获取
表单下拉列表:
<select name="menu">
<option value="0">—— ——</option>
<option value="1">个人信息</option>
<option value="2">修改密码</option>
<option value="3">博客管理</option>
<option value="4">好友管理</option>
<option value="6">短信管理</option>
<option value="7">链接管理</option>
<option value="8">参数设定</option>
<option value="9">布局管理</option>
<option value="10">安全管理</option>
</select>
获取的JavaScript代码:
var select = document.getElementById("menu");
var options = select.getElementsByTagName("option");
var menuId = null;
var menuName = null;
for(var i=0;i<options.length;i++) {
if(options[i].selected) {
menuId = options[i].value;
menuName = options[i].innerText;
break;
}
}
判断下拉列表中哪个选项被选中,通过判断options[i]的selected属性是否为true;如果被选中,取出value和innerText。
这里,你完全可以把option中的value(即options[i].value)设置为对应于数据库中一条记录的主键ID,而把innerText(即options[i].innerText)设置为一条记录的name,比如,表示菜单的表为MENU,其主键为id,还有一个字段就是菜单名称name,在JSP页面上将菜单的id和name分别迭代出来,分别置于select下拉列表中option中的value和innerText位置上即可。
3、判断表单文本框输入为数字
表单:
<input id="money" type="text" name="money" value=""/>
JavaScript代码:
var money = document.getElementById("money").value;
if(isNaN(money)) {
document.getElementById("tipsInfo").innerText = "必须是数字!!!";
return false;
}
isNaN()函数表示某个变量的值不是数字,通过isNaN()函数就能判断输入的是否是数字。
4、设置单选按钮不被选中
在填写表单的时候,很可能需要重置表单内容,包括将已经选中的单选按钮设置为未选中状态。
表单上的单选按钮:
<input type="radio" name="anser" value="A">
<input type="radio" name="anser" value="B">
<input type="radio" name="anser" value="C">
<input type="radio" name="anser" value="D">
<input type="button" name="clear" value="清空" onclick="clear()" >
对应的JavaScript代码:
function clear() {
var ansers = document.getElementsByName("anser");
for(var i=0;i<ansers.length;i++) {
if(ansers[i].checked) {
ansers[i].checked = false;
}
}
}
当然,通过这种方式,也可以通过判断获取到选择的单选按钮的value。
分享到:
相关推荐
通过JavaScript 动态的添加表单 删除表单
JavaScript中的循环总结(教辅)JavaScript中的循环总结(教辅)JavaScript中的循环总结(教辅)JavaScript中的循环总结(教辅)JavaScript中的循环总结(教辅)JavaScript中的循环总结(教辅)JavaScript中的循环...
JavaScript常用运算符和操作符总结(教辅)JavaScript常用运算符和操作符总结(教辅)JavaScript常用运算符和操作符总结(教辅)JavaScript常用运算符和操作符总结(教辅)JavaScript常用运算符和操作符总结(教辅)...
JavaScript知识点个人总结
在课堂上学到的JavaScript进行总结,希望可以帮助更多的人,多多分享自己,从而能互相学习,如果写的有错误的地方也希望大家能指正
Javascript学习总结, Javascript学习总结, Javascript学习总结, Javascript学习总结 Javascript学习总结
JavaScript学习笔记,详细总结。总结了JavaScript学习过程中的重点、难点。
javascript_鼠标事件总结javascript_鼠标事件总结javascript_鼠标事件总结javascript_鼠标事件总结javascript_鼠标事件总结javascript_鼠标事件总结javascript_鼠标事件总结javascript_鼠标事件总结javascript_鼠标...
javascript面向对象要点总结,感觉不错
javascript对象创建方法总结,通过这些方法的总结,可以对对象有了更深一步的了解,也加深了对对象的巩固认识。
开发工具与关键技术:Adobe Dreamweaver JavaScript JavaScript对象总结知识点
javascript操作DIV总结(弹出窗口篇)只供参考,请多多指教
TypeScript 入门教程。从 JavaScript 程序员的角度总结思考,循序渐进的理解 TypeScript。.zip,TypeScript 入门教程
JavaScript调用WebService实例总结
javascript基础知识总结,详细的介绍了基础知识
总结javascript基础知识,很全面
javascript效果经典大总结javascript效果经典大总结
javaScript学习笔记总结.docx
一个完美教程。。。Javascript操作XML和HTML,Javascript操作XML和HTML,Javascript操作XML和HTML
JavaScript语法一览表,Javascript基本语法,javascript语法