Jquery中val()表单取值赋值的实例代码


Posted in Javascript onAugust 15, 2013

jQuery提供了强大的val()方法来处理value相关操作。
获得单个select的值和多选select的值。

HTML 代码:
<p></p><br/>
<select id="single">
  <option>Single</option>
  <option>Single2</option>
</select>
<select id="multiple" multiple="multiple">
  <option selected="selected">Multiple</option>
  <option>Multiple2</option>
  <option selected="selected">Multiple3</option>
</select>
jQuery 代码:
$("p").append(
  "<b>Single:</b> "   + $("#single").val() +
  " <b>Multiple:</b> " + $("#multiple").val().join(", ")
);
结果:
[ <p><b>Single:</b>Single<b>Multiple:</b>Multiple, Multiple3</p>]

获取文本框中的值
HTML 代码:
<input type="text" value="some text"/>
jQuery 代码:
$("input").val();

结果:
some text
下面是var()能获取/赋予表单元素值
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>val()方法</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
<script language="javascript">
$(function(){
$("input[type=button]").click(function(){
var sValue=$(this).val();//先获取按钮的value值
$("input[type=text]").val(sValue); //赋给文本框
});
});
</script>
</head>
<body>
<p>
<input type="button" value="Feed">
    <input type="button" value="the">
    <input type="button" value="Input">
</p>
<p>
<input type="text" value="click a button">
</p>
</body>
</html>

注意:var data=$("#myId").val();
如果myid不存在,data为undefined
Javascript 相关文章推荐
Javascript注入技巧
Jun 22 Javascript
用Javascript实现Sleep暂停功能代码
Sep 03 Javascript
IE6下拉框图层问题探讨及解决
Jan 03 Javascript
JavaScript中实现Map的示例代码
Sep 09 Javascript
详解JSON1:使用TSQL查询数据和更新JSON数据
Nov 21 Javascript
详解微信小程序input标签正则初体验
Aug 18 Javascript
vue绑定事件后获取绑定事件中的this方法
Sep 15 Javascript
Vue插件从封装到发布的完整步骤记录
Feb 28 Javascript
react基本安装与测试示例
Apr 27 Javascript
深度解读vue-resize的具体用法
Jul 08 Javascript
vue-router之解决addRoutes使用遇到的坑
Jul 19 Javascript
基于JavaScript实现猜数字游戏代码实例
Jul 30 Javascript
jquery ajax方式直接提交整个表单核心代码
Aug 15 #Javascript
js冒泡法和数组转换成字符串示例代码
Aug 14 #Javascript
js实现无需数据库的县级以上联动行政区域下拉控件
Aug 14 #Javascript
Extjs3.0 checkboxGroup 动态添加item实现思路
Aug 14 #Javascript
Javascript中判断变量是数组还是对象(array还是object)
Aug 14 #Javascript
js页面跳转的问题(跳转到父页面、最外层页面、本页面)
Aug 14 #Javascript
Microsfot .NET Framework4.0框架 安装失败的解决方法
Aug 14 #Javascript
You might like
要会喝咖啡也要会知道咖啡豆
2021/03/03 咖啡文化
一个php作的文本留言本的例子(五)
2006/10/09 PHP
PHP取整函数:ceil,floor,round,intval的区别详细解析
2013/08/31 PHP
PHP小教程之实现双向链表
2014/06/12 PHP
微信公众平台接口开发入门示例
2014/12/24 PHP
php检测apache mod_rewrite模块是否安装的方法
2015/03/14 PHP
session 加入redis的实现代码
2016/07/15 PHP
php 使用expat方式解析xml文件操作示例
2019/11/26 PHP
JavaScript 利用StringBuffer类提升+=拼接字符串效率
2009/11/24 Javascript
js实现缓冲运动效果的方法
2015/04/10 Javascript
JavaScript 字符串数字左补位,右补位,取固定长度,截位扩展函数代码
2017/03/25 Javascript
vue+echarts实现动态绘制图表及异步加载数据的方法
2018/10/17 Javascript
vue-cli3+typescript新建一个项目的思路分析
2019/08/06 Javascript
vue实现信息管理系统
2020/05/30 Javascript
如何构建 vue-ssr 项目的方法步骤
2020/08/04 Javascript
在Python中使用base64模块处理字符编码的教程
2015/04/28 Python
python创建一个最简单http webserver服务器的方法
2015/05/08 Python
读写json中文ASCII乱码问题的解决方法
2016/11/05 Python
基于Python中numpy数组的合并实例讲解
2018/04/04 Python
python实现将读入的多维list转为一维list的方法
2018/06/28 Python
用Python逐行分析文件方法
2019/01/28 Python
Python 通过requests实现腾讯新闻抓取爬虫的方法
2019/02/22 Python
python关于矩阵重复赋值覆盖问题的解决方法
2019/07/19 Python
python字典排序的方法
2019/10/12 Python
2021年值得向Python开发者推荐的VS Code扩展插件
2021/01/25 Python
Coccinelle官网:意大利的著名皮具品牌
2019/05/15 全球购物
自荐信如何“自荐”
2013/10/24 职场文书
医院总经理职责
2013/12/26 职场文书
个人简历自我评价
2014/02/02 职场文书
2014入党积极分子批评与自我批评思想报告
2014/10/06 职场文书
酒店客房服务员岗位职责
2015/04/09 职场文书
原生JavaScript实现简单五子棋游戏
2021/06/28 Javascript
SpringBoot实现quartz定时任务可视化管理功能
2021/08/30 Java/Android
详解JS数组方法
2021/11/20 Javascript
收音机爱好者玩机13年,简评其使用过的19台收音机
2022/04/30 无线电
nginx sticky实现基于cookie负载均衡示例详解
2022/12/24 Servers