<!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方法扩展使用
2014-12-02 19:28 789//非负浮点数 保留一位小数---添加到jquery.vali ... -
jquery操作select值，jqery设置select值
2014-10-15 21:26 1154每一次操作select的时候，总是要出来翻一下资料，不如自己总 ... -
jquery ajax相关操作
2014-09-28 13:50 837--ajax 请求当有记录时给予提交，rows为0时提示提示框 ... -
jquery ajax和data的使用
2014-09-04 14:58 1127function print(selId){ $. ... -
Js中parseFloat()精度问题
2014-07-08 16:11 2364<!DOCTYPE HTML PUBLIC " ... -
jquery attr()属性
2014-07-04 19:07 3066在JS中设置节点的属性与属性值用到setAttribute() ... -
CSS中line-height与height的区别
2014-07-03 19:32 1509CSS中line-height与height的区别？ lin ... -
freemarker为空判断详细
2014-05-27 22:08 53021freemarker里面判断为空只有？？，后来查找其他文档才发 ... -
FreeMarker中if标签内的判断条件
2014-05-13 18:41 17684FreeMarker中if标签内的判断条件 FreeMark ... -
FreeMarker 对null值的处理
2014-05-05 17:40 2676以下引用官方描述： The FreeMarker temp ... -
freemarker ?datetime ? time ?date
2014-04-30 16:28 2735?date,?time和?datetime，因为你指定的格式告 ... -
div设置显示与隐藏、边框等
2014-04-30 16:24 25191.div 设置隐藏后页面占 ... -
div设置显示与隐藏、边框等
2014-04-30 16:22 18541.div 设置隐藏后页面占 ... -
用jquery计算前两个文本框的结果等于第三个文本框
2014-04-23 21:19 1421//本记录是结束里程数-起始里程数=运行里程数 //其它 ... -
jQuery.validate使用手册-详解
2014-04-09 14:22 1215jQuery.validate是一款非常不错的表单验证工具，简 ... -
jQuery对表单元素的取值和赋值操作
2014-04-08 22:13 1445jQuery对表单元素的取值 ... -
freemarker list (长度,遍历,下标,嵌套,排序)
2014-03-13 09:56 137211. freemarker获取list的size ： ... -
Extjs Config和Mixins
2014-03-05 13:23 1083Extjs 4中，为类型系统引入了Config概念，Con ... -
js回调函数
2014-03-04 11:40 1095回调函数(Callback Functions ... -
extjs4.0 Ext.Array 函数方法详解
2014-03-04 10:34 1177Ext.onReady(function(){ ...
相关推荐
本篇文章将详细总结在使用jQuery获取input type="text"元素中的值时的各种方法。 首先需要了解的是，在HTML中，input元素通常用来创建各种表单控件，其中input type="text"就是用来创建单行文本输入框。jQuery提供...
jquery radio取值，checkbox取值，select取值，radio选中，checkbox选中，select选中，及其相关 获取一组radio被选中项的值 var item = $(‘input[name=items][checked]’).val(); 获取select被选中项的文本 var ...
Jquery-Ajax各种获取方式 <body> <input id="getJsData" type="button" value="获取js值"/> <input id="getMessage" type="button" value="获取单个值"/> <input id="getUserInfo" type=...
在本篇内容中，我们将详细探讨如何使用jQuery来获取form表单中input元素的值，包括文本框、复选框、单选按钮等不同类型input元素的值获取方法。通过jQuery提供的val()方法和attr()方法，我们可以轻松获取或设置input...
获取文本框（`<input type="text">`）的值 文本框是最常见的表单元素之一。使用jQuery获取文本框的值非常简单： ```javascript var textVal = $("#text_id").val(); // 使用.val()方法获取值 ``` **注意：** `....
如何用javascript获取...一、jquery获取input文本框中的值 通过 name var name = $('input[name="CN_NAME"]').val(); 通过 id var name = $('#CN_NAME').val(); 通过 class var name = $('.CN_NAME').val(); 二、jav
下面将详细解释如何使用jQuery来获取和设置text、textarea、radio、checkbox以及select等不同类型的input控件的值。 1. **获取text和textarea值**： - 对于`<input type="text">`和`<textarea>`，可以使用`.attr()...
在这个场景中，`input`框可以是任何类型的输入元素，如`<input type="text">`, `<textarea>`, 或自定义的可编辑区域。不论何时，只要需要知道输入框在页面上的具体位置，以上的方法都可以派上用场。 需要注意的是，...
在这个场景中，我们需要一个特定类型的`input`，即`type="text"`，但为了显示日期选择器，我们需要将其类型改为`type="date"`。这样的`input`标签会像这样编写： ```html <input type="date" id="datePicker" ...
在本例中，我们学习了如何使用 jQuery 选择器和 `each()` 函数来遍历并修改所有 `type="text"` 的 `input` 控件的值。这只是一个基础示例，实际上 jQuery 可以处理更复杂的场景，如异步请求、事件绑定等，是前端...
根据给定文件内容，下面介绍有关于jQuery实现input[type=file]多图预览上传删除功能的知识点。 ### jQuery实现多图上传预览与删除功能 #### 1. 前端界面结构 在实现多图上传预览与删除功能时，首先需要布局一个...
本文将重点讨论如何通过正则表达式获取`<input type="text">`标签中的`value`值，并过滤掉`<input type="checkbox">`标签。 1. **获取`<input type="text">`中的`value`值** 在HTML文档中，`<input>`标签可以有多种...
可以使用 `$("#select_id option[text='jQuery']").attr("selected", true)` 方法设置 Select 的 Text 值为 jQuery 的项选中。 三、 jQuery 添加/删除 Select 的 Option 项 jQuery 也提供了方法来添加或删除 ...
本文将详细讲解如何使用jQuery在div中获取和操作input元素的值。 首先，理解基本的HTML结构是至关重要的。假设我们有一个包含input元素的div，其HTML代码可能如下所示： ```html <div id="myDiv"> <input type=...
在上述例子中，无论使用原生JavaScript还是jQuery，我们都是通过获取input元素并设置其value属性来实现自动赋值的。这种方法对于动态页面尤其有用，比如从服务器获取数据后填充表单，或者根据用户的行为改变输入框的...
#### 获取`<input type="text">`中的值 除了文件上传功能，表单中通常也会包含文本输入框，供用户输入各种文本信息。使用jQuery同样可以简化获取文本输入框值的过程。 1. **通过ID获取值**：在jQuery中，可以使用`...
6. 表单元素的创建：在新插入的行中创建了文本输入框（`<input type="text">`）以及按钮（`<input type="button">`）。这些表单元素可以用于用户输入数据或触发事件。 7. 用户交互反馈：当用户点击“删除”按钮时，...