目录 实验15 ——有关错误验证的保留值。...设置名字为空 输入工资值 56 点击“Save Employee”按钮。 会出现验证失败,但是数字 56 仍然显示在 Salary 文本框中。 ? 测试2 ?...如图所示,姓名仍然保留在文本框中,却未保留工资,接下来我们来讨论上述问题的解决办法。 关于实验15 是否是真的将值保留? 不是,是从post数据中重新获取的。...实验16——添加客户端验证 首先了解,需要验证什么? 1. FirstName 不能为空 2. LastName字符长度不能大于5 3. Salary不能为空,且应该为数字类型 4....当凭证错误时,UserName 文本框的值是如何被重置的? HTML 帮助类会从Post 数据中获取相关值并重置文本框的值。这是使用HTML 帮助类的一大优势。 Authorize属性有什么用?
语法 data 注意:同时,还可以读取 HTML5 自定义属性 data-index ,得到的是数字型。...注意1: 只能增加本商品的数量, 就是当前+号的兄弟文本框(itxt)的值。 修改表单的值是val() 方法 注意2: 这个变量初始值应该是这个文本框的值,在这个值的基础上++。...要获取表单的值 减号(decrement)思路同理,但是如果文本框的值是1,就不能再减了。...核心代码: $('.decrement').click(function() { // 点击“-”按钮 if (parseInt($(this).next().val()) > 0) { // 对文本框的数字进行限制...案例:购物车案例模块-计算总计和总额 把所有文本框中的值相加就是总额数量,总计同理。 文本框里面的值不同,如果想要相加需要用 each() 遍历,声明一个变量做计数器,累加即可。 代码实现见下文。
keydown 当键盘按下时第一个发生的事件,对所有按键有效 keypress 当键盘按下时第二个发生的事件,对中文和特殊按键无效 keyup 当键盘弹起时发生的事件,对所有按键有效 通过如下html代码进行验证...对整个页面上下文分别做了三个键盘事件的绑定,先打开chrome浏览器的console窗体,然后在文本框中随意输入一个英文字母或数字时,就可以看到这个在三个键盘事件的执行顺序,如图5-14所示。...图5-15按下中文按键测试 在jQuery中,如果你要获取键盘输入的是什么按键,那么可以利用事件参数的which属性即可(event.which)。...a,此时在console窗体中的keydown事件中显示的却是大写字母A对应的ascii码值65,而在keypress事件中显示的是正确的小写字母a对应的ascii码97。...图5-16测试按下字母 总结现象得到,当开发人员要求获取键盘输入的按键大小写敏感或输入中文时,要特别注意对按键事件的筛选。
的属性操作模块分为四个部分:html属性操作,dom属性操作,类样式操作和值操作 html属性操作:是对html文档中的属性进行读取,设置和移除操作。...比如addClass()、removeClass()、toggleClass() 值操作:是对DOM属性value进行读取和设置操作。...,对表单注册进行简单的验证。...if(reg.test(user)){ $(this).next().html("√").css("color","green"); }else...{//如果是false,不符合规则; $(this).next().html("账户不符合规则,最少4位,以a-z|A-z,数字").css("color","red");
文本框失去焦点事件、获得焦点事件 onBlur:当失去输入焦点后产生该事件 onFocus:当输入获得焦点后,产生该文件 Onchange:当文字值改变时,产生该事件 Onselect:当文字加亮后,产生该文件...focus():得到焦点时使用,和javascript中的onfocus使用方法相同。...这里label覆盖在文本框上,可以更好的控制样式 jquery代码 $(function() { $(‘#searchKey’).focus(function() { $(‘#lbSearch’)....其中placeholder就是其中一个,它可以同时完成文本框获得焦点和失去焦点。必须保证input的value值为空, placeholder的内容就是我们在页面上看到的内容。...代码如下: 第二种: jQuery 原理:让表单的val值等于其title值。
; break; } 第二章-JavaScript操作BOM对象 一些小案例,欢迎参考 点击按钮,文本框值加1 jQuery验证用户名,密码等表单数据的有效性 光标离开文本框时,验证数据的合法性,如果不符合要求则提示 提交表单时使用submit方法验证数据的合法性,根据验证函数的返回值true...,不合法直接在文本框后提示 提交表单时,验证数据的合法性,不合法在文本框后提示 关键代码: $("#user").blur(function...需求说明: 光标进入用户名文本框时,提示用户输入“首位为字母的4-15个数字,字母,下划线”,离开文本框时验证用户名的合法性,不合法直接提示 光标进入密码框时提示“4-10个字母和下划线”离开密码框时...email) {// 判断文本框是否有值 alert("请输入Email地址或昵称!")
文本框的输入的内容可能会有各种限制,比如文本框中只能够输入正整数。 下面就是一段能够实现此功能的代码实例,需要的可以做一下参考。 代码实例如下: 实例1 前端 jquery/1.9.0/jquery.js...= 48 && code <= 57 || code == 8) { return true; } else { return false; } }) //文本框输入事件...$(this).val($(this).val().replace(/\D|^0/g,''));,将非数字或者以0为开头的替换为空。...(4)$("input").bind("paste",function(){ return false; }), 为文本框注册paste事件处理函数,这个是为了防止对文本框复制黏贴操作。
注意:同时,还可以读取 HTML5 自定义属性 data-index ,得到的是数字型。...案例:购物车案例模块-增减商品数量 1.核心思路:首先声明一个变量,当我们点击+号(increment),就让这个值++,然后赋值给文本框。...2.注意1: 只能增加本商品的数量, 就是当前+号的兄弟文本框(itxt)的值。 3.修改表单的值是val() 方法 4.注意2: 这个变量初始值应该是这个文本框的值,在这个值的基础上++。...要获取表单的值 5.减号(decrement)思路同理,但是如果文本框的值是1,就不能再减了。 代码实现略。(详情参考源代码) 1.2.3....案例:购物车案例模块-计算总计和总额 1.把所有文本框中的值相加就是总额数量,总计同理。 2.文本框里面的值不同,如果想要相加需要用 each() 遍历,声明一个变量做计数器,累加即可。
jQuery 元素操作主要讲的是用jQuery方法,操作标签的遍历、创建、添加、删除等操作。 一、 遍历元素 jQuery 隐式迭代是对同一类元素做了同样的操作。... }) }) 二、 案例:购物车案例模块-计算总计和总额 把所有文本框中的值相加就是总额数量,总计同理。...文本框里面的值不同,如果想要相加需要用 each() 遍历,声明一个变量做计数器,累加即可。...点击+号-号,会改变总计和总额,如果用户修改了文本框里面的值同样会改变总计和总额 因此可以封装一个函数求总计和总额,以上2个操作调用这个函数即可....注意 :总计是文本框里面的值相加用val() ,总额是普通元素的内容用text() 要注意普通元素里面的内容要去掉¥并且转换为数字型才能相加 // 封装一个函数 function getSum
5. var maxIndex=$("#select_id option:last").attr("index"); //获取Select最大的索引值 jQuery设置Select选择的 Text和...$("#select_id option[text='jQuery']").attr("selected", true); //设置Select的Text值为jQuery的项选中 jQuery添加...(注意中间有空格) var cc2 = $('.formc select[name="country"]').val(); //得到下拉菜单的选中项的值 var cc3 = $('.formc select...[name="country"]').attr("id"); //得到下拉菜单的选中项的ID属性值 $("#select").empty();//清空下拉框 //$("#select").html(...(注意中间没有空格) 3,复选框: $("input[@type=checkbox][@checked]").val(); //得到复选框的选中的第一项的值 $("input[@type=checkbox
('input')var input = inputs[0]; input.attributes 得到的结果是: NamedNodeMap {0: type, 1: value, length: 2,...对于上例的文本框,我们可以通过property方式像这样input.value或者 attribute方式像这样 input.getAttribute( "value" ) 来获得值,并且得到的结果都是...当我们在页面中编辑文本框的值,再次在console中获取的时候发现input.value的值是更新后的值,而input.getAttribute的值仍旧是旧的。...W3C forms specification, checked 属性是一个 boolean attribute, 因此checked property只能是true或者false(当勾选为true,未勾选或者未设置为..." (String) 记录初始状态, 值为"checked"或者任意你设置的值,不会随着勾选状态而改变 jQuery的attr()方法获的的结果也跟getAttribute是一致的: $(‘input[
jQuery、YUI、underscore都是这样的做法。...var obj = {"a":1,"b":2}; console.log(obj.hasOwnProperty("aaa")); 这个示例比较详细,并且加入了错误之后的处理: //得到页面上的用户名的文本框...oDomain.onchange = check; function check(){ clearAllTip(); //清除所有提示框 //得到值...username) { return; } //正则验证合法性 //6~18个字符,可使用字母、数字...; }else{ //服务器验证结果跟用户选项不一致的时候 //就要给用户显示推荐的邮箱
文本框的获取焦点事件的触发: // 方式一 文本框元素.focus(); // 方式二 文本框元素.trigger("focus"); // 方式三 文本框元素.triggerHandler("focus...通过 arguement.length 可以得到有一个参数,这个参数是一个对象,里面有很多事件相关的属性。...相应的按键按下后,对应事件的值为 true。...这就要求对象调用方法后的返回值还是这个对象,那么这个方法内部是如何实现的呢? 其实很简单:就是在最后返回调用其的对象。return this; 就好了。...还有一个问题,就是 jQuery 中 val(); 在没有参数时时读取数值,不能链式编程;在有参数的时候是设置,可以链式编程。
对象,这样就可以使用jquery提供的方法操作 声明一个叫$this的jquery对象变量, 给声明的变量赋值,赋的值是将this的HTML元素转换为jQuery对象。...php _POST['num'] : 0; if(num > 0){ echo '大于0'; }else if( 当点击“检测”按钮时,获取输入框中的值,并将该值使用...jQuery 常用插件 表单验证插件——validate 该插件自带包含必填、数字、URL在内容的验证规则,即时显示异常信息,此外,还允许自定义验证规则,插件调用方法如下: $(form).validate...3-8微调按钮插件——spinner 微调按钮插件不仅能在文本框中直接输入数值,还可以通过点击输入框右侧的上下按钮修改输入框的值,还支持键盘的上下方向键改变输入值,调用格式如下: $(selector)...的值,w3c盒子模型不包含,IE盒子模型则包含,而在jQuery 中,可以通过$.support.boxModel对象返回的值,检测浏览器是否属于标准的w3c盒子模型。
checkbox 的值 选中某 Checkbox 的同时取消选择其他所有 jQuery: Uncheck other checkbox on one checked 判断是否被选中 Toggle...checkbox 的值 JS 方法 document.getElementById('viewDept').checked Jquery 方法 $('id').val() 得到多个值并用逗号分割:...v; }); $("input[type='checkbox']").is(':checked') 返回结果:选中=true,未选中=false ---- 获取 Iframe 里面的元素 和 Jquery...").css("background-color","blue"); ---- 表单 获取表单里各种值 获取值: 文本框,文本区域:$("#txt").attr("value"); 多选框 checkbox...event, func){ if (el.addEventListener) { el.addEventListener(event, func, false); } else
Validate是用于B/S结构客户端验证用的JQuery扩展插件,使用时需要引用两个js文件,分别是: jquery.validate.min.js" type="text/javascript"> 1、基本使用方法,通过样式设置验证规则 当表单提交时,如果没有填写email或者是错误的email将发生错误,如下所示: 文本框后面的默认提示可以修改jquery.validate.min.js...class可以一项或多项中间用空格分隔,语法格式与css一样,可选择的项还有: (1)required:true 必输字段 (2)remote:"check.php" 使用ajax方法调用check.php验证输入值...,不验证有效性 (7)number:true 必须输入合法的数字(负数,小数) (8)digits:true 必须输入整数 (9)creditcard: 必须输入合法的信用卡号 (10)equalTo:
这是因为在使用attr函数获得checked属性的值时,如果复选框处于选中状态,则获得true;如果复选框处于未选中状态,则获得undefined,并非false。...对于这个问题就可以使用prop来代替attr即可 在使用prop函数获取checked属性的值时,如果复选框处于未选中状态,那么返回false。...id="btn" value="测试"/> $("#btn").click( function(){ var val=$("#txt").val(); document.write("文本框值的类型是...type和isNumeric函数对文本框的值进行了检测,运行效果如图6.1.12所示。...var obj=$.parseJSON(str); alert("名字是:"+obj.name+",年龄是:"+obj.age); } ) 上述代码把文本框的值取出后先实用
这是因为在使用attr函数获得checked属性的值时,如果复选框处于选中状态,则获得true;如果复选框处于未选中状态,则获得undefined,并非false。...对于这个问题就可以使用prop来代替attr即可 在使用prop函数获取checked属性的值时,如果复选框处于未选中状态,那么返回false。...button" id="btn" value="测试"/>$("#btn").click(function(){var val=$("#txt").val();document.write("文本框值的类型是...函数对文本框的值进行了检测,运行效果如图6.1.12所示。...val());var obj=$.parseJSON(str);alert("名字是:"+obj.name+",年龄是:"+obj.age);}) 上述代码把文本框的值取出后先实用
某人需要在时间控件给文本框赋值时,触发事件函数。实现的效果: 1、文本框支持手工输入,通过用户输入修改值,手工输入结束后触发事件。...http-equiv="Content-Type"; content="text/html; charset=utf-8"> jquery...; $(that).trigger('change'); }); } }) } else...实现原理为元素得到焦点后开始监听Value,元素失去焦点后对比前后的Value,前后Value不相等时触发。 ... 注:在查资料的过程中看到有的地方说onchange在非IE8以下的浏览器中会实时监听文本变化,但是我在实际测试中发现并没有实时监听,此处有问题货错误还请指教 :-D 或者是Jquery
/jquery/jquery.validate.js"> (2)定义验证规则 直接在页面表单元素中通过属性实现验证规则: <input name="${product}" value=...: $('form').validate(); Jquery.validate框架提供的验证器类型: (4)jquery.validate验证框架提供的验证规则: (1)required:true ...,不验证有效性 (7)number:true 必须输入合法的数字(负数,小数) (8)digits:true 必须输入整数 (9)creditcard...这个方法将会清空所有的文本框,密码框,文本域里的值,去掉下拉列表所有被选中的项,让所有复选框和单选框里被选中的项不再选中。...: (1)设置文本框的值: $('input:button').val('I am a button') $('input:checkbox').val('I am a checkbox') $('input