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 相关文章推荐
jquery ready()的几种实现方法小结
Jun 18 Javascript
jQuery对表单元素的取值和赋值操作代码
May 19 Javascript
js 阻止子元素响应父元素的onmouseout事件具体实现
Dec 23 Javascript
移动Web中图片自适应的两种JavaScript解决方法
Jun 18 Javascript
jQuery中$.extend()用法实例
Jun 24 Javascript
JS实现倒计时(天数、时、分、秒)
Nov 16 Javascript
vuejs响应用户事件(如点击事件)
Mar 14 Javascript
基于JavaScript实现报警器提示音效果
Oct 27 Javascript
Vue 开发音乐播放器之歌手页右侧快速入口功能
Aug 08 Javascript
element-ui中select组件绑定值改变,触发change事件方法
Aug 24 Javascript
Node使用Nodemailer发送邮件的方法实现
Feb 24 Javascript
JavaScript类的继承多种实现方法
May 30 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
Php Cookie的一个使用注意点
2008/11/08 PHP
mac下使用brew配置环境的步骤分享
2011/05/23 PHP
php 函数中使用static的说明
2012/06/01 PHP
php打造智能化的柱状图程序,用于报表等
2015/06/19 PHP
PHP数学运算函数大汇总(经典值得收藏)
2016/04/01 PHP
PHP判断数组是否为空的常用方法(五种方法)
2017/02/08 PHP
使用ucenter实现多站点同步登录的讲解
2019/03/21 PHP
在Laravel 中实现是否关注的示例
2019/10/22 PHP
window.parent调用父框架时 ie跟火狐不兼容问题
2009/07/30 Javascript
jquery 元素相对定位代码
2010/10/15 Javascript
jQuery的初始化与对象构建之浅析
2011/04/12 Javascript
将HTMLCollection/NodeList/伪数组转换成数组的实现方法
2011/06/20 Javascript
Bootstrap每天必学之前端开发框架
2015/11/19 Javascript
后端接收不到AngularJs中$http.post发送的数据原因分析及解决办法
2016/07/05 Javascript
Ajax的概述与实现过程
2016/11/18 Javascript
解决Vue2.0自带浏览器里无法打开的原因(兼容处理)
2017/07/28 Javascript
electron制作仿制qq聊天界面的示例代码
2018/11/26 Javascript
微信小程序实现页面浮动导航
2019/01/28 Javascript
Vue2(三)实现子菜单展开收缩,带动画效果实现方法
2019/04/28 Javascript
python selenium UI自动化解决验证码的4种方法
2018/01/05 Python
Python获取系统所有进程PID及进程名称的方法示例
2018/05/24 Python
python实现控制台打印的方法
2019/01/12 Python
解决Django生产环境无法加载静态文件问题的解决
2019/04/23 Python
python3.7 openpyxl 删除指定一列或者一行的代码
2019/10/08 Python
如何在python开发工具PyCharm中搭建QtPy环境(教程详解)
2020/02/04 Python
CSS3实现任意图片lowpoly动画效果实例
2017/05/11 HTML / CSS
上海天奕面试题笔试题
2015/04/19 面试题
介绍一下JMS编程步骤
2015/09/22 面试题
体育教师工作总结的自我评价
2013/10/10 职场文书
教师党员思想汇报
2014/01/06 职场文书
少儿节目主持串词
2014/04/02 职场文书
寒假家长评语大全
2014/04/16 职场文书
外贸业务员岗位职责
2015/02/13 职场文书
请病假条范文
2015/08/17 职场文书
单位提档介绍信
2015/10/22 职场文书
Python编解码问题及文本文件处理方法详解
2021/06/20 Python