JQuery从头学起第三讲


Posted in Javascript onJuly 06, 2010
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="JQuery3.aspx.cs" Inherits="JQuery_1.JQuery3" %> 
<!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 runat="server"> 
<title></title> 
<script type="text/javascript" src="JS/jquery-1.3.2.min.js"></script> 
<script type="text/javascript"> 
function Get() { 
var v1 = $("#txt1").val();//获取文本框输入的值 
var v11 = $("#txt1").attr("value");//获取文本框输入的值,效果和上面方法一致 
var v2 = $("#txt2").val();//文本框输入的密码的值 
var v3 = $("input[name='ck']:checked").val();//获取checkbox勾上后的值, 
var v4 = $("#h1").val();//获取隐藏控件的值 
var v5 = $("input[name='rdo']:checked").val();//获取一组radio被选中的值 
var v6 = $("#ss").val();//获取下来框选中的value 
var v7 = $("select[name='s1'] option[value='" + v6 + "']").text();//选取下拉框选中的文本 
var v8 = $("select[id='ss'] option[value='" + v6 + "']").text();//选取下拉框选中的文本,上面是通过name来获取,这里是通过ID来获取,但这里的ID不能加# 
alert(v1+","+v2+","+v3+","+v4+","+v5+","+v6+","+v8) 
} 
</script> 
</head> 
<body> 
<form id="form1" runat="server"> 
<div> 
<input type="text" id="txt1" /> 
<input type="password" id="txt2" /> 
男<input type="checkbox" id="ck1" name="ck" value="男" /> 
<input type="hidden" id="h1" value="www.54talk.cn" /> 
www<input type="radio" id="r1" name="rdo" value="www" /> 
54talk<input type="radio" id="r2" name="rdo" value="54talk" /> 
cn<input type="radio" id="r3" name="rdo" value="cn" /> 
<select name="s1" id="ss"> 
<option value="0">男</option> 
<option value="1">女</option> 
</select> 
<input type="button" onclick="Get()" value="取值"/> 
</div> 
</form> 
</body> 
</html>

以上DEMO中的代码是我一个个敲出来的,都经过测试,大家可以放心的使用。这个DEMO中主要加了对输入框的几种类型的取值,这也列举了取值的两种方式,DEMO中除了介绍了文本框的取值外还介绍了下拉框,单选框,多选框的取值,这里用到了复合属性选择器,需要同时满足多个条件时使用。不像文本框那么单纯,用个ID就可以获取到值。在获取select的value的时候也用个复合属性选择器就可以了,但是要获取下拉框的文本就要先得到value,再根据value去获取text。

今天这一讲就讲这么多,下一讲我们讲用JQuery来对这些常用控件赋值,因为我们在做页面初始化的时候,常常需要对某些控件进行初始化。

Javascript 相关文章推荐
window.location和document.location的区别分析
Dec 23 Javascript
javascript 动态设置已知select的option的value值的代码
Dec 16 Javascript
JQuery动态创建DOM、表单元素的实现代码
Aug 09 Javascript
js数字转换为float,取N位小数
Feb 08 Javascript
jQuery实用技巧必备(中)
Nov 03 Javascript
JS+CSS实现的漂亮渐变背景特效代码(6个渐变效果)
Mar 25 Javascript
jQuery模拟Marquee实现无缝滚动效果完整实例
Sep 29 Javascript
javascript基本数据类型和转换
Mar 17 Javascript
JavaScript自执行函数和jQuery扩展方法详解
Oct 27 jQuery
Java设计中的Builder模式的介绍
Mar 22 Javascript
详解webpack 打包文件体积过大解决方案(code splitting)
Apr 10 Javascript
React学习之受控组件与数据共享实例分析
Jan 06 Javascript
一步一步制作jquery插件Tabs实现过程
Jul 06 #Javascript
jQuery基础知识filter()和find()实例说明
Jul 06 #Javascript
jQuery中filter(),not(),split()使用方法
Jul 06 #Javascript
jQuery选择没有colspan属性的td的代码
Jul 06 #Javascript
jquery 查找新建元素代码
Jul 06 #Javascript
jquery 3D球状导航的文章分类
Jul 06 #Javascript
Javascript Function对象扩展之延时执行函数
Jul 06 #Javascript
You might like
Drupal简体中文语言包安装教程
2014/09/27 PHP
thinkphp普通查询与表达式查询实例分析
2014/11/24 PHP
php数组添加与删除单元的常用函数实例分析
2015/02/16 PHP
php实现的mongodb操作类实例
2015/04/03 PHP
Laravel 5 框架入门(一)
2015/04/09 PHP
PHP用反撇号执行外部命令
2015/04/14 PHP
在Linux系统下一键重新安装WordPress的脚本示例
2015/06/30 PHP
如何使用微信公众平台开发模式实现多客服
2016/01/06 PHP
PHP5.5.15+Apache2.4.10+MySQL5.6.20配置方法分享
2016/05/06 PHP
用JavaScript脚本实现Web页面信息交互
2006/10/11 Javascript
setAttribute 与 class冲突解决
2008/02/17 Javascript
JavaScript实现的内存数据库LokiJS介绍和入门实例
2014/11/17 Javascript
Vue 固定头 固定列 点击表头可排序的表格组件
2016/11/25 Javascript
使用 Vue.js 仿百度搜索框的实例代码
2017/05/09 Javascript
微信小程序之发送短信倒计时功能
2017/08/30 Javascript
初探JavaScript 面向对象(推荐)
2017/09/03 Javascript
JS跳转手机站url的若干注意事项
2017/10/18 Javascript
javascript使用正则实现去掉字符串前面的所有0
2018/07/23 Javascript
JS实现的新闻列表自动滚动效果示例
2019/01/30 Javascript
在Node.js中将SVG图像转换为PNG,JPEG,TIFF,WEBP和HEIF格式的方法
2019/08/22 Javascript
python处理csv数据动态显示曲线实例代码
2018/01/23 Python
Python 25行代码实现的RSA算法详解
2018/04/10 Python
TensorFlow实现随机训练和批量训练的方法
2018/04/28 Python
使用Python的OpenCV模块识别滑动验证码的缺口(推荐)
2019/05/10 Python
python中的单引号双引号区别知识点总结
2019/06/23 Python
python logging模块的使用总结
2019/07/09 Python
Python3.9又更新了:dict内置新功能
2020/02/28 Python
如何通过python计算圆周率PI
2020/11/11 Python
纯css3实现的动画按钮的实例教程
2014/11/17 HTML / CSS
一款利用html5和css3实现的3D滚动特效的教程
2015/01/04 HTML / CSS
科颜氏印度官网:Kiehl’s印度
2021/02/20 全球购物
J2EE模式面试题
2016/10/11 面试题
开水果连锁店创业计划书
2013/12/29 职场文书
班级安全教育实施方案
2014/02/23 职场文书
酒店优秀员工事迹材料
2014/06/02 职场文书
聘任书格式及范文
2015/09/21 职场文书