用户表单事件(focus事件)
- 1、下载文档前请自行甄别文档内容的完整性,平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益,请联系客服反馈,我们会尽快为您处理(人工客服工作时间:9:00-18:30)。
⽤户表单事件(focus事件)
以前做⽤户系统的时候经常⽤到表单验证,正则表达式事件来处理和绑定事件和进⾏事件,这⾥说的其实只是⼀⼩部分,也不是很值得写,但是今天遇到了还是写⼀下,毕竟基础还是蛮重要的,就算懂的童鞋,巩固⼀下也是好的.
focus事件包括focusin事件和focusout事件.
focusin事件指绑定focus事件之后触发焦点获取焦点的事件。
focusout事件指绑定focus事件之后触发焦点之后丢失焦点的同时触发的事件.
举个例⼦:
要求:
⽤户中⼼有姓名和年纪,输⼊姓名和年纪,如果没有输⼊且为空时,⿏标离开input时会有提⽰(⽂本提⽰).
HTML代码:
<div class="dom">
<input type="text" name="name" > //姓名
</div>
<div class="dom">
<input type="text" name="ago" > //年纪
</div>
<div class="result"></div>
CSS样式。
//这⾥我就不写了,⾼宽什么的
JS代码:
//引⼊jq版本⽂件
var inputText = {'name':'姓名','ago':'年纪'} //赋予对应的值
$('.dom').focusout(inputText,function(event){
var inputCanshu = event.data;
var inputContent = $(this).children(":text"); //获取内容
var inputName = inputContent.attr("name"); //内容添加name值
var res= ' ';
if(!inputContent.val()){ //判断内容是否为空
res = inputCanshu[inputName]="不能为空!"; //调⽤参数数组的内容
}
$(".result").html(res);
});
其实运⾏起来也是挺容易的,多写⼏遍就懂了,随⼿写的。
⼈是铁饭是钢,⼀顿不吃饿得慌!。