JQuery获取input type="text"中的值的各种方式
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml> <html xmlns="http://www.w3.org/1999/xhtml"> <head>
<title>JQuery获取文本框的值</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<script src="jquery-1.5.1.min.js" type="text/javascript"></script> <script type="text/javascript">
//使用id的方式获取
$(document).ready(function(){
//1
$("#button_text1").click(function(){
var result1 = $("#input_text1").val();
alert("result1 = " + result1);
});
//2
$("#button_text2").click(function(){
var result2 = $("input[id='input_text2']").val();
alert("result2 = " + result2);
});
//3
$("#button_text3").click(function(){
var result3 = $("input[id='input_text3']").attr("value");
alert("result3 = " + result3);
});
//4. 可以通过type的值来获取input中的值（未演示）
/*
$("#button_text4").click(function(){
var result4 = $("input[type='text']").val();
alert("result4 = " + result4);
});
*/
//5. 可以通过name的值来获取input中的值（未演示）
/*
$("#button_text5").click(function(){
var result5 = $("input[name='text']").val();
alert("result5 = " + result5);
});
*/
});
</script>
</head> <body>
<!-- 获取文本框的值：方式一 -->
<div id="test1">
<input id="input_text1" type="text" value="test1" style="width: 100px;" />
<button id="button_text1">test1</button>
</div>
<!-- 获取文本框的值：方式二 -->
<div id="test2">
<input id="input_text2" type="text" value="test2" style="width: 100px;" />
<button id="button_text2">test2</button>
</div>
<!-- 获取文本框的值：方式三 -->
<div id="test3">
<input id="input_text3" type="text" value="test3" style="width: 100px;" />
<button id="button_text3">test3</button>
</div>
</body> </html>
JQuery获取input type="text"中的值的各种方式的更多相关文章
- zepto区别于jquery获取select表单选中的值
在jquery下,我们获取select表单选中的值通常是通过$('select').val()来实现,这样的方式简单又明了,或者通过$('select option[selected]').text( ...
- HTML：<input type="text">文本框不可编辑的方式
1.<input type="text" name="name" value="姓名" disabled /> 该方式显示的文本 ...
- jquery 获取 input type radio checked的元素
.find('input:radio:checked'):.find("input[type='radio']:checked");.find("input[name=' ...
- jQuery获取input复选框的值
var ipResolveValue =[]; //定义一个空数组$("input[name='ipResolve']:checked").each(function(){ / ...
- 如何让<input type="text" />中的文字居中
高(height)和行高(line-height)相等.不能用vertical-align
- jquery获取input输入框中的值
如何用javascript获取input输入框中的值,js/jq通过name.id.class获取input输入框中的value 先准备一段 HTML <input type="tex ...
- js与jquery获取input输入框中的值
如何用javascript获取input输入框中的值,js/jq通过name.id.class获取input输入框中的value 先准备一段 HTML 一.jquery获取input文本框中的值 通过 ...
- <input type="text"/>未输入时属性value的默认值--js学习之路
在百度ife刷题是自己的一个错误引发了我对<input type="text"/>的学习. 先贴代码: <!DOCTYPE html> <html&g ...
- Jquery获取input=text 的值
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
随机推荐
- Paint on a Wall
Paint on a Wall 题目链接:http://acm.split.hdu.edu.cn/showproblem.php?pid=4012 搜索+状态压缩 这题刚开始以为是dp(之前写过墙是一 ...
- IQueryable和IEnumerable,IList的区别
IQueryable和IEnumerable都是延时执行(Deferred Execution)的,而IList是即时执行(Eager Execution) IQueryable和IEnumerabl ...
- thinkphp 的两种建构模式 第一种一个单入口里面定义两个模块，前台和后台，函数控制模块必须function.php前台加载前台模块的汉书配置文件，后台加载后台模块的汉书配置文件，公共文件共用。第二种架构模式两个单入口文件，分别生成两个应用定义define。。。函数可以定义配置文件。。。。
thinkphp 的两种建构模式 第一种一个单入口里面定义两个模块,前台和后台,函数控制模块必须function.php前台加载前台模块的汉书配置文件,后台加载后台模块的汉书配置文件,公共文件共用. ...
- HDtune(硬盘检测) V5.5 中文绿色版
软件名称:HDtune(硬盘检测) V5.5 中文绿色版软件语言: 简体中文授权方式: 免费软件运行环境: Win 32位/64位软件大小: 565KB 图片预览: 软件简介:HD Tune Pro一 ...
- 杭电三部曲一、基本算法；19题 Cow Bowling
Problem Description The cows don't use actual bowling balls when they go bowling. They each take a n ...
- hdu 5524 二叉树找规律，二进制相关
input n 1<=n<=1e18 output 有n个结点的满二叉树有多少个不相同结点数的子树 做法:树有h=log2(n)层,最多有2h-2种(1除外),然后再n减去u重复的即可 # ...
- Default Constructor的构造操作
Default Constructor的构造操作 C++ Annotated Reference Manual书中的Section 12.1说过:default constructor 只有在编译器需 ...
- 安卓Activity组件
Activity生命周期 熟悉javaEE的朋友们都了解servlet技术,我们想要实现一个自己的servlet,需要继承相应的基类,重写它的方法,这些方法会在合适的时间被servlet容器调用.其 ...
- BaLaBaLa
#include<cstdio>#include<cstring>#include<cmath>#include<queue>#include<a ...
- VirtualBox中安装CentOS（新手教程）
1.VirtualBox下载 官网:http://www.virtualbox.org/wiki/Downloads 下载好之后,一路下一步安装即可 2.CentOS下载 官网:https://www ...