一直认为val()方法只有两个功能：1、能设置元素的值，2、获取元素的值。知道val()方法还有另外一个妙用，就是它能使select（下拉列表框）、checkbox（多选框）和radio（单选框）相应的选项被选中，在表单操作中会经常用到。而你使用的$("select").val()并不是把所有选项的value显示出来,而是把选中项的value显示出来。

　　

下面的2,4,6其实都是通过$("select").val()得到的，具体代码如下：

<script>

    $(function(){

        $("select").change(function(){

            var strHtml = $("select").val();

            $("#p1").text(strHtml);

        });

    });

</script>

既然能得到选中项的value,自然可以设置选中项
 代码如下：

$("select").val("Item 3");

补充：在jquery中，val()方法中是从最后一个选项往前读取。而如果要设置多个属性的话

则是：$("select").val(["Item 3","Item 5"]);

当然用val()这样子实现，你也是可以用attr实现的~

而checkbox（多选框）和radio（单选框） 也是以此类推~

本文仅个人所见，更详细见 这儿

 补充——val()不仅有此用途，还可以用来清空内容

$(selector).val()  这是获得元素的value

$(selector).val(value)   这是设置元素的value   故而当你在项目中想要清空某元素的内容，只要 $(selector).val(' ')就ok了

<!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="Content-Type" content="text/html; charset=gb2312" />

<title>无标题文档</title>

<script type="text/javascript" src="../scripts/jquery-1.8.3.min.js"></script>

<script>

    $(function(){

        $("#btn").click(function(){

            $("#txtarea").val('');

            $("#txt").val('');

        });

    });

</script>

</head>

<body>

    <textarea id="txtarea"  cols="" rows="">点击清空按钮后，内容全部清空</textarea>

    <input type="text"  id="txt"  value="点击清空按钮后，内容全部清空"/>

    <input type="button" id="btn" value="清空" />

</body>

</html>

使用val()另一个妙用------选中select/checkbox/radio的值的更多相关文章

  1. jquery 操作select,checkbox,radio （整理）

    在工作中经经常使用到select,checkbox,radio,今天有点空暇就整理一下,免得以后用的时候还要又一次找. 操作select下拉框 -- 获取值或选中项: 1, $("#sele ...

  2. jq获取被选中的option的值。jq获取被选中的单选按钮radio的值。

    温故而知新,一起复习下jq的知识点. (1) jq获取被选中的option的值 <select id="select_id"> <option value=&qu ...

  3. JQuery操作select checkbox radio总结

    JQuery是一个非常强大的工具,所以我必须找到它最方便的方法,嘻嘻 Select CRUD: Select搜: 1.val值: $("#selectid").val();     ...

  4. JQuery获取被选中的checkbox的value值

    文章源头:http://www.cnblogs.com/td960505/p/6123510.html 以下为使用JQuery获取input checkbox被选中的值代码: <html> ...

  5. 使用JQuery获取被选中的checkbox的value值 以及全选、反选

    以下为使用JQuery获取input checkbox被选中的值代码: <html> <head> <meta charset="gbk"> & ...

  6. 使用JQuery获取被选中的checkbox的value值

      上网查了一下,感觉一些人回答得真的是不知所云,要么代码不够简便.或者是有些想装逼成分等. 以下为使用JQuery获取input checkbox被选中的值代码: <html>    & ...

  7. jQuery 设置select，radio的值，无法自动触发绑定的change事件

    一.问题 今天在对select和radio做change事件绑定后,手动设置其value值,但是不能触发change事件 二.解决 使用trigger方法手动触发

  8. checkbox，select，radio 选取值,设定值,回显值

    获取一组radio被选中项的值var item = $('input[@name=items][@checked]').val();获取select被选中项的文本var item = $(" ...

  9. jquery radio取值，checkbox取值，select取值，radio选中，checkbox选中，select选中

    jQuery获取Select选择的Text和Value: 语法解释: 1. $("#select_id").change(function(){//code...}); //为Se ...

随机推荐

  1. [转]CentOS 5.5下FTP安装及配置

    一.FTP的安装 1.检测是否安装了FTP : [root@localhost ~]# rpm -q vsftpd vsftpd-2.0.5-16.el5_5.1 否则显示:[root@localho ...

  2. NGUI Tutorial 3

    一. Create a Button 一.(Menu)NGUI -> Create -> Sprite 二.attach box colider to the Sprite , then ...

  3. WinForm 中ComboBox 绑定总结

    1.DataTable绑定 用DataTable直接绑定,只需要设置DataSource.DisplayMember.ValueMember三个属性即可. this.cmbConsume.DataSo ...

  4. HDU 2544 最短路(模板题)

    求1到N的最短路径,模板题,以1为源点,用dijkstra算法(可以用优先级队列优化) #include <iostream> #include <algorithm> #in ...

  5. Struts 2知识回顾----拦截器(Intercept)总结

    什么是Struts 2拦截器? 从软件构架上来说,拦截器是实现了面向方面编程的组件.它将影响了多个业务对象的公共行为封装到一个个可重用的模块,减少了系统的重复代码,实现功能的高度内聚,确保了业务对象的 ...

  6. 利用BBRSACryptor实现iOS端的RSA加解密

    背景 RSA这种非对称加密被广泛的运用于网络数据的传输,但其在iOS上很难直接实现,BBRSACryptor框架通过移植openssl实现了iOS端的RSA,本文将介绍如何使用BBRSACryptor ...

  7. PCB电路板上防潮绝缘抗腐蚀的三防漆

    三防漆(Conformal Coating)是一种涂在电路板上以形成保护膜的方法,这层保护膜通常仅是薄薄的一层(约30-210µm),它可以用来加强电子产品的防潮.防污.防尘.防化学污染的能力,也可以 ...

  8. Qt 自定义model实现文件系统的文件名排序（重定义sort函数即可。忽然开窍了：其实捕捉点击Header事件，内部重排序，全部刷新显示即可）

    前段时间,需要做一个功能是要做文件系统的排序的功能.由于是自己写的model, 自己定义的数据结构.最初的想法只有一个自己去实现文件夹跟文件名的排序算法,不过感觉比较费时间.后来想到的是QFileSy ...

  9. C# Java间进行RSA加密解密交互

    原文:C# Java间进行RSA加密解密交互 这里,讲一下RSA算法加解密在C#和Java之间交互的问题,这两天纠结了很久,也看了很多其他人写的文章,颇受裨益,但没能解决我的实际问题,终于,还是被我捣 ...

  10. Centos硬件信息查看命令

    [root@yan-001 ~] # uname -a # 查看内核/操作系统/CPU信息的linux系统信息命令 [root@yan-001 ~] # head -n 1 /etc/issue # ...