jquery 常用表单操作函数集(1/4)

1、关于页面元素的引用
通过jquery的$()引用元素包括通过id、class、元素名以及元素的层级关系及dom或者xpath条件等方法,且返回的对象为jquery对象(集合对象),不能直接调用dom定义的方法。
2、jquery对象与dom对象的转换
只有jquery对象才能使用jquery定义的方法。注意dom对象和jquery对象是有区别的,调用方法时要注意操作的是dom对象还是 jquery对象。
普通的dom对象一般可以通过$()转换成jquery对象。
如:$(document.getelementbyid("msg"))则为jquery对象,可以使用jquery的方法。
由于jquery对象本身是一个集合。所以如果jquery对象要转换为dom对象则必须取出其中的某一项,一般可通过索引取出。
如:$("#msg")[0],$("div").eq(1)[0],$("div").get()[1],$("td")[5]这些都是dom对象,可以使用dom中的方法,但不能再使用jquery的方法。
以下几种写法都是正确的:
3、如何获取jquery集合的某一项
对于获取的元素集合,获取其中的某一项(通过索引指定)可以使用eq或get(n)方法或者索引号获取,要注意,eq返回的是jquery对象,而 get(n)和索引返回的是dom元素对象。对于jquery对象只能使用jquery的方法,而dom对象只能使用dom的方法,如要获取第三个
元素的内容。有如下两种方法:
$("div").eq(2).html(); //调用jquery对象的方法
$("div").get(2).innerhtml; //调用dom的方法属性
4、同一函数实现set和get
jquery中的很多方法都是如此,主要包括如下几个:
$("#msg").html(); //返回id为msg的元素节点的html内容。
//将"new content" 作为html串写入id为msg的元素节点内容中,页面显示粗体的new content
$("#msg").text(); //返回id为msg的元素节点的文本内容。
//将"new content" 作为普通文本串写入id为msg的元素节点内容中,页面显示new content
$("#msg").height(); //返回id为msg的元素的高度
$("#msg").height("300′); //将id为msg的元素的高度设为300
$("#msg").width(); //返回id为msg的元素的宽度
$("#msg").width("300′); //将id为msg的元素的宽度设为300
$("input").val("); //返回表单输入框的value值
$("input").val("test"); //将表单输入框的value值设为test
$("#msg").click(); //触发id为msg的元素的单击事件
$("#msg").click(fn); //为id为msg的元素单击事件添加函数
同样blur,focus,select,submit事件都可以有着两种调用方法 

首页 1 2 3 4 末页

时间: 2024-09-23 22:53:00

jquery 常用表单操作函数集(1/4)的相关文章

推荐10个不错jQuery表单操作代码片段

代码片段1: 在表单中禁用"回车键" 大家可能在表单的操作中需要防止用户意外的提交表单,那么下面这段代码肯定非常有帮助:  代码如下 复制代码 $("#form").keypress(function(e) {   if (e.which == 13) {     return false;   } }); 代码片段2: 清除所有的表单数据 可能针对不同的表单形式,你需要调用不同类型的清楚方法,不过使用下面这个现成方法,绝对能让你省不少功夫.  代码如下 复制代码

jquery入门-$.each 数组操作与表单操作代码

对于radio.checkbox.select的赋值操作:  代码如下: $("input[name=a]").val(["娱乐1"]); $("input[type=checkbox]").val(["篮球", "游戏"]); $("select").val(["篮球", "游戏"]); 代码分析: 对radio赋值,属性选择器获取radio:

Jquery响应回车键直接提交表单操作代码_jquery

事情是这样的,做了一个登陆页面,把 Form 去了,直接拿 Jquery 的 Ajax 跟服务器交互,但是这样的话 浏览器就不会默认响应 回车键提交数据了.索性让 Jquery 也接管 回车键的响应吧: 复制代码 代码如下: $("#loginbox input[type='submit']").click(function() {     //Ajax 与服务器交互验证 }); $('#loginbox').keydown(function(e){     if(e.keyCode

js控制表单操作的常用代码小结_javascript技巧

1.鼠标经过时自动选择文本Code: 复制代码 代码如下: 鼠标划过自动选中:<input type="text" value="默认值" onMouseOver="this.focus();" onfucus="this.seelct()" /> 2.设置单选按钮Code: 复制代码 代码如下: <html><head><meta http-equiv="Content-T

Jquery操作radio,checkbox,select表单操作实现代码_jquery

用户名: 性   别: 男  女   省   份: 北京上海   年   份: 2008年2009年2010年   输出姓名   输出性别   输出省份   输出年份   结   果:   省   份: 北京上海广州     天津其他   输   出:   结   果:  

thinkPHP5 ajax提交表单操作实例分析

本文实例讲述了thinkPHP5 ajax提交表单操作.分享给大家供大家参考,具体如下: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script src="//cdn.bootcss.com/jquery/3.1.1/jquery.min.js"></script> <

AngularJS表单操作几个例子(表单提交,表单编辑默认值)

模仿着我要搞了个AngularJS Form,但是问题来了.... 发现初始化时候ng-model 跟 input 标签里的 value 不默契,冲突.. 后来想再AngularJS controller 里预先赋值 $scope.formData = {'name':'张三'}; 可以通过php程序把值赋到这个AngularJS controller里  代码如下 复制代码 <!-- AngularJS controller --> <script>     var formAp

Java利用HttpClient模拟POST表单操作应用及注意事项_java

HttpClient使用post方法提交数据 源代码: 复制代码 代码如下: package post; import Java.io.IOException; import org.apache.commons.httpclient.Header; import org.apache.commons.httpclient.HttpClient; import org.apache.commons.httpclient.HttpException; import org.apache.commo

js的表单操作 简单计算器_javascript技巧

代码: 复制代码 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv