jquery中对表单的基本操作代码


Posted in Javascript onJuly 29, 2010
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head runat="server"> 
<title></title> 
<script src="../conn/jsfile/jquery.js" type="text/javascript"></script> 
</head> 
<body> 
<form id="form1" runat="server"> 
文本框 :<input type="text" id="txt" value="txt" /><br /> 
单选按钮:<input type="radio" value="男" checked="checked" name="sex" />男 <input type="radio" value="女" name="sex" checked="checked"/>女<br /> 
复选框:<input type="checkbox" value="1" name="cc"/>1<input type="checkbox" value="2" checked="checked" name="cc" />2<input type="checkbox" value="3" checked="checked" name="cc" />3<br /> 
下拉框: 
<select id="sel" style="width: 100px"> 
<option value="yi">1</option> 
<option value="er" selected="selected">2</option> 
<option value="san">3</option> 
</select> 
<script language="javascript" type="text/javascript"> 
/*------------------------------------------------javascript-------------------------------------------*/ 
/* 获取文本框的值 
alert(document.getElementById("txt").value); 
*/ 
/*获取单选按钮的值 
var radios = document.getElementsByName("sex"); 
var n = radios.length; 
for (var i = 0; i < n; i++) { 
if (radios[i].checked) { 
alert(radios[i].value); 
} 
} 
*/ 
/*获取复选框中选中的值的组合 1,2,3,4 
var checkboxs = document.getElementsByName("cc"); 
var n = checkboxs.length; 
for (var i = 0; i < n; i++) { 
if (checkboxs[i].checked) { 
alert(checkboxs[i].value); 
} 
} 
*/ 
/*获取下拉列表的选中项的值 
方法一: 
alert(document.getElementById("sel").value); 
方法二: 
var sel = document.getElementById("sel"); 
alert(sel.options[sel.selectedIndex].value); 
*/ 
/*------------------------------------------------jquery-------------------------------------------*/ 
/*获取文本框的值 
alert($("#txt").val()); 
*/ 
/*获取单选框选中项的值 
alert($(":radio[name='sex']:checked").val()); 
单选框赋值 设置选中项 
$(":radio[name='sex']").val(["男"]); 
*/ 
/*获取复选框的值 
$(":checkbox[name='cc']:checked").each(function(i) { 
alert(this.value); 
}); 
复选框赋值 选中这几项 
$(":checkbox[name='cc']").val(["1", "2", "3"]); 
*/ 
/*获取下拉列表的值 
alert($("#sel").val()); 
获取下拉列表的文本 
alert($("#sel option:selected").text()); 
*/ 
</script> 
</form> 
</body> 
</html>
Javascript 相关文章推荐
JSDoc 介绍使用规范JsDoc的使用介绍
Feb 12 Javascript
探讨在JQuery和Js中,如何让ajax执行完后再继续往下执行
Jul 09 Javascript
JS实现光滑展开合拢的菜单效果代码
Sep 16 Javascript
基于javascript实现listbox左右移动
Jan 29 Javascript
JS脚本实现动态给标签控件添加事件的方法
Jun 02 Javascript
总结javascript中的六种迭代器
Aug 16 Javascript
Bootstrap 表单验证formValidation 实现远程验证功能
May 17 Javascript
jQuery实现带右侧索引功能的通讯录示例【附源码下载】
Apr 17 jQuery
vue移动端路由切换实例分析
May 14 Javascript
详解Vue开发微信H5微信分享签名失败问题解决方案
Aug 09 Javascript
探秘vue-rx 2.0(推荐)
Sep 21 Javascript
浅谈vuex actions和mutation的异曲同工
Dec 13 Javascript
jquery下利用jsonp跨域访问实现方法
Jul 29 #Javascript
jquery-easyui关闭tab自动切换到前一个tab
Jul 29 #Javascript
jquery 图片轮换效果
Jul 29 #Javascript
jQuery的写法不同导致的兼容性问题的解决方法
Jul 29 #Javascript
基于jQuery制作迷你背词汇工具
Jul 27 #Javascript
IE之动态添加DOM节点触发window.resize事件
Jul 27 #Javascript
js操作二级联动实现代码
Jul 27 #Javascript
You might like
Win2003服务器安全加固设置--进一步提高服务器安全性
2007/05/23 PHP
基于PHP常用函数的用法详解
2013/05/10 PHP
thinkphp模板赋值与替换实例简述
2014/11/24 PHP
php类自动加载器实现方法
2015/07/28 PHP
PHP基于堆栈实现的高级计算器功能示例
2017/09/15 PHP
PHP实现打包下载文件的方法示例
2017/10/07 PHP
PHP数组array类常见操作示例
2020/05/15 PHP
获取任意Html元素与body之间的偏移距离 offsetTop、offsetLeft (For:IE5+ FF1 )[
2006/12/22 Javascript
js function定义函数使用心得
2010/04/15 Javascript
解读JavaScript中 For, While与递归的用法
2013/05/07 Javascript
IE8下String的Trim()方法失效的解决方法
2013/11/08 Javascript
js检验密码强度(低中高)附图
2014/06/05 Javascript
jQuery实现响应浏览器缩放大小并改变背景颜色
2014/10/31 Javascript
Jquery检验手机号是否符合规则并根据手机号检测结果将提交按钮设为不同状态
2015/11/26 Javascript
jquery按回车键实现表单提交的简单实例
2016/05/25 Javascript
JavaScript中日常收集常见的10种错误(推荐)
2017/01/08 Javascript
彻底学会Angular.js中的transclusion
2017/03/12 Javascript
ES6解构赋值的功能与用途实例分析
2017/10/31 Javascript
微信小程序之onLaunch与onload异步问题详解
2019/03/28 Javascript
[02:56]DOTA2矮人直升机 英雄基础教程
2013/11/26 DOTA
python中反射用法实例
2015/03/27 Python
简单了解python变量的作用域
2019/07/30 Python
pyinstaller打包opencv和numpy程序运行错误解决
2019/08/16 Python
Selenium关闭INFO:CONSOLE提示的解决
2020/12/07 Python
澳洲本土太阳镜品牌:Quay Australia
2019/07/29 全球购物
金融专业应届生求职信
2013/11/02 职场文书
会议邀请书范文
2014/02/02 职场文书
幼儿园课题实施方案
2014/05/14 职场文书
党员群众路线教育实践活动学习笔记
2014/11/05 职场文书
小学生毕业评语
2014/12/26 职场文书
中学生社会实践教育活动总结
2015/05/06 职场文书
国庆节新闻稿
2015/07/17 职场文书
使用Pytorch实现two-head(多输出)模型的操作
2021/05/28 Python
无线电知识基础入门篇
2022/02/18 无线电
Javascript中async与await的捕捉错误详解
2022/03/03 Javascript
Go归并排序算法的实现方法
2022/04/06 Golang