jQuery中val()方法用法实例

本文实例讲述了jQuery中val()方法用法。分享给大家供大家参考。具体分析如下:

此方法设置或获取匹配元素的value属性值。

只有具有value属性的元素才能够使用此方法。比如input元素可以使用此方法,而div元素就不可以。

使用方式:

用法一:

此方法不带参数的时候是返回第一个匹配元素的value属性值。例如:

代码如下:

$("input").val()

以上代码是获取第一个input元素的value属性值。
实例代码:

代码如下:

<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="http://www.jb51.net/" />
<title>val()函数-我们</title>
<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script>
<script type="text/javascript">
$(document).ready(function(){
  $("button").click(function(){
    alert($("input").val());
  })
})
</script>
</head>
<body>
<div>
  <ul>
    <li>
      <input type="text" value="请输入用户名" />
    </li>
  </ul>
</div>
<button>点击查看效果</button>
</body>
</html>

用法二:

此方法带有参数的时候是设置所有匹配元素的属性值。例如:

代码如下:

$("input").val("这是测试脚本")

以上代码将所有input元素的value属性值设置为"这是测试脚本"。
实例:

代码如下:

<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="http://www.jb51.net/" />
<title>val()函数-我们</title>
<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script>
<script type="text/javascript">
$(document).ready(function(){
  $("button").click(function(){
    $("input").val("这是测试脚本");
  })
})
</script>
</head>
<body>
<div>
  <ul>
    <li>
      <input type="text" value="请输入用户名" />
    </li>
  </ul>
</div>
<button>点击查看效果</button>
</body>
</html>

希望本文所述对大家的jQuery程序设计有所帮助。

时间: 2014-12-22

jquery 根据name名获取元素的value值

提问: 我要获取name属性为test的元素 但是这个test是赋值给变量的 如var name='test'; 即要获取name属性为变量name的元素 请问jquery怎么写? 答案: $("input[name="+name+"]") 问题和答案都很简单,正所谓会者不难难者不会,有相同需要的小伙伴自己来参考下吧.

浅析JQuery中的html(),text(),val()区别

1.HTML html():取得第一个匹配元素的html内容.这个函数不能用于XML文档.但可以用于XHTML文档 html(val):设置每一个匹配元素的html内容.这个函数不能用于XML文档.但可以用于XHTML文档. 2.TEXT text():取得所有匹配元素的内容.一般用id区别 结果是由所有匹配元素包含的文本内容组合起来的文本.这个方法对HTML和XML文档都有效. text(val):设置所有匹配元素的文本内容 与 html() 类似, 但将编码 HTML (将 "<&qu

jquery控制select的text/value值为选中状态

每一次操作select的时候,总是要在网上翻下,太繁琐了,自己在这里总结下. 比如<select class="selector"></select> 1.设置value为"全部"的项选中 复制代码 代码如下: $(".selector").val("全部"); 2.设置text为"全部"的项选中 复制代码 代码如下: $(".selector").find(&q

jQuery中的val()示例应用

1.实例源码 复制代码 代码如下: <!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-eq

Jquery使用val方法读写value值

本文实例讲述了Jquery使用val方法读写value值.分享给大家供大家参考.具体如下: <!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"> &

JQuery中的html()、text()、val()区别示例介绍

1.HTML html():取得第一个匹配元素的html内容.这个函数不能用于XML文档.但可以用于XHTML文档 html(val):设置每一个匹配元素的html内容.这个函数不能用于XML文档.但可以用于XHTML文档. 2.TEXT text():取得所有匹配元素的内容. 结果是由所有匹配元素包含的文本内容组合起来的文本.这个方法对HTML和XML文档都有效. text(val):设置所有匹配元素的文本内容 与 html() 类似, 但将编码 HTML (将 "<" 和 &

jQuery对val和atrr("value")赋值的区别介绍

做项目的时候,我从后台传递过来的数据给一个文本框赋值,通过google浏览器, 当修改的时候发现没有修改,最后查了下原因,原来是jQuery中val和atrr("value",对浏览器的区别, 故总结如下: jquery中的val()和atrr('value'这两个的使用,假设有默认值的情况下,如果用val()赋值了,那么当修改这个值得时候,google不能获取最新的值,但是ie可以, 针对atrr('value'如果有默认值,那么当改变这个值得时候,ie和google都能获取最新的更

jquery获取当前点击对象的value方法

例:获取ul中li的value值 首先,在html中我们要为每个li设置value值 复制代码 代码如下: <ul> <li value="你好"></li> <li value="hello"></li> <li value="=-="></li> </ul> 再通过jquery根据点击事件获取对应的value 复制代码 代码如下: $(docume

jquery text(),val(),html()方法区别总结

text():1.无参获取每一个匹配元素的文本内容 2.有参数 给每一个匹配元素赋值 val():1.无参获取第一个匹配元素的值 2.有参数 给每一个匹配元素赋值 html():1.无参获取第一个匹配元素的标签内容 2.有参数给每一个匹配元素赋值

jQuery获取文本节点之 text()/val()/html() 方法区别

在jquery中val,text,html都能取到值,或加一个参数来赋值,那么它们有些什么区别?下面我们来举例说明: 首先,html属性中有两个方法,一个有参,一个无参 1. 无参html():取得第一个匹配元素的html内容.这个函数不能用于XML文档.但可以用于XHTML文档,返回的是一个String 例子: html页面代码:<div><p>Hello</p></div> jquery代码:$("div").html(); 结果:H

jQuery中text() val()和html()的区别实例详解

简单的说:html()和text()的区别主要在于是否包含标签.而val()针对的是表单元素. 但是有时还是不是那么太清晰. html(),val(),text()都分为有参和无参. 举例说明它们的不同之处: html()在没有参数的情况下,取得第一个匹配元素的内容.必须要注意的是,即使匹配多个,也只能取得匹配的第一个元素. 如: <body> <p>你选中这段文字后,看看它们的文本颜色和背景色,就能明白::selection的作用.</p> <h3>选中下

jquery 学习之二 属性 文本与值(text,val)

text() 取得所有匹配元素的内容. 结果是由所有匹配元素包含的文本内容组合起来的文本.这个方法对HTML和XML文档都有效. Get the text contents of all matched elements. The result is a string that contains the combined text contents of all matched elements. This method works on both HTML and XML documents.

浅谈jQuery this和$(this)的区别及获取$(this)子元素对象的方法

1.JQuery this和$(this)的区别 相信很多刚接触JQuery的人,很多都会对$(this)和this的区别模糊不清,那么这两者有什么区别呢? 首先来看看JQuery中的  $()  这个符号,实际上这个符号在JQuery中相当于JQuery(),即$(this)=jquery();也就是说,这样可以返回一个jquery对象.那么,当你在网页中alert($('#id'));时,会弹出一个[object Object ],这个object对象,也就是jquery对象了. 那么,我们

从重置input file标签中看jQuery的 .val() 和 .attr(“value”) 区别

背景: 在清空input file标签选中值时,分别用了以下方法,发现有的对有的错: [√]$("#file")[0].value = ""; [√]$("#file")[0].value = null; [×]$("#file").attr("value",""); [×]$("#file").attr("value",null); [√]$(&

妙用Jquery的val()方法

看下面的一个例子: 复制代码 代码如下: <input type="text" id="address" value="请输入邮箱地址"/> <br/><br/> <input type="text" id="password" value="请输入邮箱密码"/> <br/><br/> <input type=