一直认为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. 【C++之STL】理解容器(ing)

    “容器可容纳一些数据的模板类” “容器是包容其他对象的对象” 两种类型:顺序容器.关联容器   顺序容器 关联容器 访问成员 顺序访问和随机访问 经过优化关键键值访问                 ...

  2. java基础知识回顾之javaIO类---FileWriter和FileReader

    FileWriter类的构造方法定义如下: 1.public FileWriter(File file)throws IOException 字符流的操作比字节流操作好在一点,就是可以直接输出字符串了 ...

  3. lintcode: search for a range 搜索区间

    题目 搜索区间 给定一个包含 n 个整数的排序数组,找出给定目标值 target 的起始和结束位置. 如果目标值不在数组中,则返回[-1, -1] 样例 给出[5, 7, 7, 8, 8, 10]和目 ...

  4. lintcode:插入区间

    题目: 插入区间 给出一个无重叠的按照区间起始端点排序的区间列表. 在列表中插入一个新的区间,你要确保列表中的区间仍然有序且不重叠(如果有必要的话,可以合并区间). 样例 插入区间[2, 5] 到 [ ...

  5. 【Linux高频命令专题(19)】vi/vim

    概述 其实在Linux中一切命令或者软件都是文件,所以把vi/vim作为高频命令专题之一,也没什么不妥.虽然大家都称之为编辑器~~ vim是vi的高级版本,比如有代码高亮,也就是说可以把vim定位为程 ...

  6. [Unity菜鸟] Final IK

    由于本人英文较烂,边翻译用户手册边学习. 用户手册  IK Components Final IK 包含许多强大高速的IK组件 Aim  AimIK solver是一个对CCD算法(cyclic co ...

  7. Hibernate逍遥游记-第12章 映射值类型集合-005对集合排序(<order-by>\<sort>)

    1. 2. <?xml version="1.0"?> <!DOCTYPE hibernate-mapping PUBLIC "-//Hibernate ...

  8. VS2010/MFC编程入门之一(VS2010与MSDN安装过程图解)

    原文地址: VS2010/MFC编程入门之一(VS2010与MSDN安装过程图解)-软件开发-鸡啄米 http://www.jizhuomi.com/software/139.html   上一讲中鸡 ...

  9. iOS 深入理解RunLoop

    RunLoop 是 iOS 和 OSX 开发中非常基础的一个概念,这篇文章将从 CFRunLoop 的源码入手,介绍 RunLoop 的概念以及底层实现原理.之后会介绍一下在 iOS 中,苹果是如何利 ...

  10. 含有特殊字符的JSON串解析方法

    工具方法:public static <T> T parseJsonString(String json,Class<T> classType){ ObjectMapper m ...