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 相关文章推荐
一个符号插入器 中用到的js代码
Sep 04 Javascript
很酷的javascript loading效果代码
Jun 18 Javascript
javascript中取前n天日期的两种方法分享
Jan 26 Javascript
jQuery实现自动切换播放的经典滑动门效果
Sep 12 Javascript
jQuery文字横向滚动效果的实现代码
May 31 Javascript
jquery css实现邮箱自动补全
Nov 14 Javascript
bootstrap select下拉搜索插件使用方法详解
Nov 23 Javascript
vue项目中用cdn优化的方法
Jan 03 Javascript
玩转Koa之核心原理分析
Dec 29 Javascript
深入koa-bodyparser原理解析
Jan 16 Javascript
详解Vue.js 作用域、slot用法(单个slot、具名slot)
Oct 15 Javascript
Vue包大小优化的实现(从1.72M到94K)
Feb 18 Vue.js
一步一步制作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
上海无线电三厂简史修改版
2021/03/01 无线电
海河写的 Discuz论坛帖子调用js的php代码
2007/08/23 PHP
支持数组的ADDSLASHES的php函数
2010/02/16 PHP
解析isset与is_null的区别
2013/08/09 PHP
PHP简单读取PDF页数的实现方法
2016/07/21 PHP
PHP设计模式之工厂模式定义与用法详解
2018/04/03 PHP
JavaScript与Div对层定位和移动获得坐标的实现代码
2010/09/08 Javascript
jQuery+.net实现浏览更多内容(改编php版本)
2013/03/28 Javascript
js的hasownproperty使用示例
2014/03/02 Javascript
nodejs实现获取某宝商品分类
2015/05/28 NodeJs
小白谈谈对JS原型链的理解
2016/05/03 Javascript
JavaScript类型系统之布尔Boolean类型详解
2016/06/26 Javascript
IONIC自定义subheader的最佳解决方案
2016/09/22 Javascript
JS+HTML+CSS实现轮播效果
2017/11/28 Javascript
基于jQuery Ajax实现下拉框无刷新联动
2017/12/06 jQuery
微信小程序导入Vant报错VM292:1 thirdScriptError的解决方法
2019/08/01 Javascript
mpvue微信小程序开发之实现一个弹幕评论
2019/11/24 Javascript
[04:55]完美世界副总裁蔡玮:DOTA2的自由、公平与信任
2013/12/18 DOTA
详解Python Socket网络编程
2016/01/05 Python
利用python的socket发送http(s)请求方法示例
2018/05/07 Python
在Python3 numpy中mean和average的区别详解
2019/08/24 Python
Python使用Selenium实现淘宝抢单的流程分析
2020/06/23 Python
澳大利亚100%丝绸多彩度假装商店:TheSwankStore
2019/09/04 全球购物
俄罗斯最大的香水和化妆品网上商店:Randewoo
2020/11/05 全球购物
super()与this()的区别
2016/01/17 面试题
Android面试题及答案
2015/09/04 面试题
DBA的职责都有哪些
2012/05/16 面试题
交通事故检查书范文
2014/01/30 职场文书
妇女儿童发展规划实施方案
2014/03/16 职场文书
计算机多媒体专业自荐信
2014/07/04 职场文书
文明社区申报材料
2014/08/21 职场文书
80后婚前协议书范本
2014/10/24 职场文书
财务人员岗位职责
2015/02/03 职场文书
社区五一劳动节活动总结
2015/02/09 职场文书
5行Python代码实现一键批量扣图
2021/06/29 Python
python开发人人对战的五子棋小游戏
2022/05/02 Python