Jquery获得控件值的三种方法总结


Posted in Javascript onFebruary 13, 2014

一 Jquery获得服务器控件值的方法
由于ASP.NET网页运行后,服务器控件会随机生成客户端id,jquery获取时候不太好操作,google了下,总结有以下3种方法:

服务器控件代码:<asp:TextBox ID="txtUserID" runat="server"></asp:TextBox>

1. $("#<%=txtUserID.ClientID%>").val();

2. $("input[id*=txtUserID]").val();

3. $("*[id$=txtUserID]").val();

二 Jquery获得控件值的方法

取值:

$("")是一个jquery对象,而不是一个dom element
value是dom element的属性
jquery与之对应的是val
val() :获得第一个匹配元素的当前值。
val(val):设置每一个匹配元素的值。
所以,代码应该这样写:
取值:val = $("#id")[0].value;
赋值:
$("#id")[0].value = "new value";
或者$("#id").val("new value");

或者这样也可以:val = $("#id").attr("value");
获取一组radio被选中项的值

var item = $('input[@name=items][@checked]').val();
获取select被选中项的文本
var item = $("select[@name=items] option[@selected]").text();
select下拉框的第二个元素为当前选中值
$('#select_id')[0].selectedIndex = 1;
radio单选组的第二个元素为当前选中值
$('input[@name=items]').get(1).checked = true;

获取值:

文本框,文本区域:$("#txt").attr("value");
多选框checkbox:$("#checkbox_id").attr("value");
单选组radio: $("input[@type=radio][@checked]").val();
下拉框select: $('#sel').val();

控制表单元素:
文本框,文本区域:$("#txt").attr("value",'');//清空内容
$("#txt").attr("value",'11');//填充内容

多选框checkbox: $("#chk1").attr("checked",'');//不打勾
$("#chk2").attr("checked",true);//打勾
if($("#chk1").attr('checked')==undefined) //判断是否已经打勾

单选组radio: $("input[@type=radio]").attr("checked",'2');//设置value=2的项目为当前选中项
下拉框select: $("#sel").attr("value",'-sel3');//设置value=-sel3的项目为当前选中项
$("<option value='1'>1111</option><option value='2'>2222</option>").appendTo("#sel")//添加下拉框的option

$("#sel").empty();//清空下拉框

三   Jquery获得控件 DropDownList值的方法

 <script type="text/javascript">
       function bbOK()
       {         
                var a = $("#ddlGuo option:selected").val();
                var b = $("#ddlGuo option:selected").text();
                $("#txttext").attr("value", b);
                $("#txtval").attr("value", a);         
       }   
    </script>
<html>
  <asp:DropDownList ID="ddlGuo" runat="server"  >
            <asp:ListItem Selected="True" Value="001">北京市</asp:ListItem>
            <asp:ListItem Value="301">南京</asp:ListItem>
            <asp:ListItem Value="313">苏州</asp:ListItem>      
        </asp:DropDownList>
        <asp:TextBox ID="txtval" runat="server"></asp:TextBox>
        <asp:TextBox ID="txttext" runat="server"></asp:TextBox>  
<br />         
            <asp:Button ID="Button1" runat="server" Text="点击Select" OnClientClick="bbOK();" />  
 </html>
Javascript 相关文章推荐
mysql输出数据赋给js变量报unterminated string literal错误原因
May 22 Javascript
js 判断脚本加载完毕的代码
Jul 13 Javascript
Jquery attr(&quot;checked&quot;) 返回checked或undefined 获取选中失效
Oct 10 Javascript
使用简洁的jQuery方法实现隔行换色功能
Jan 02 Javascript
JavaScript中window.open用法实例详解
Apr 15 Javascript
浅析JavaScript 箭头函数 generator Date JSON
May 23 Javascript
微信小程序 canvas API详解及实例代码
Oct 08 Javascript
node.js与C语言 实现遍历文件夹下最大的文件,并输出路径,大小
Jan 20 Javascript
ES6新特性之模块Module用法详解
Apr 01 Javascript
微信小程序日期选择器实例代码
Jul 18 Javascript
微信小程序实现banner图轮播效果
Jun 28 Javascript
小程序组件之自定义顶部导航实例
Jun 12 Javascript
巧用jquery解决下拉菜单被Div遮挡的相关问题
Feb 13 #Javascript
ListBox实现上移,下移,左移,右移的简单实例
Feb 13 #Javascript
Jquery EasyUI中弹出确认对话框以及加载效果示例代码
Feb 13 #Javascript
jquery.Ajax()方法调用Asp.Net后台的方法解析
Feb 13 #Javascript
用Jquery实现滚动新闻
Feb 12 #Javascript
Jquery实现自定义tooltip示例代码
Feb 12 #Javascript
jquery实现手机发送验证码的倒计时代码
Feb 12 #Javascript
You might like
PHP实现文件安全下载
2006/10/09 PHP
php 模拟POST|GET操作实现代码
2010/07/20 PHP
Yii框架中memcache用法实例
2014/12/03 PHP
PHP基于redis计数器类定义与用法示例
2018/02/08 PHP
js兼容标准的表格变色效果
2008/06/28 Javascript
js下判断 iframe 是否加载完成的完美方法
2010/10/26 Javascript
js RuntimeObject() 获取ie里面自定义函数或者属性的集合
2010/11/23 Javascript
javascript数组去重方法终极总结
2014/06/05 Javascript
node.js中的buffer.toJSON方法使用说明
2014/12/14 Javascript
AngularJS实现表单验证
2015/01/28 Javascript
js的window.showModalDialog及window.open用法实例分析
2015/01/29 Javascript
jQuery代码实现发展历程时间轴特效
2015/07/30 Javascript
谈谈encodeURI和encodeURIComponent以及escape的区别与应用
2015/11/24 Javascript
js选择器全面解析
2016/06/27 Javascript
详解js产生对象的3种基本方式(工厂模式,构造函数模式,原型模式)
2017/01/09 Javascript
bootstrap weebox 支持ajax的模态弹出框
2017/02/23 Javascript
页面间固定参数,通过cookie传值的实现方法
2017/05/31 Javascript
解决Jquery下拉框数据动态获取的问题
2018/01/25 jQuery
jQuery实现的响应鼠标移动方向插件用法示例【附源码下载】
2018/08/28 jQuery
vue实现移动端拖动排序
2020/08/21 Javascript
jquery简易手风琴插件的封装
2020/10/13 jQuery
Python2/3中urllib库的一些常见用法
2017/12/19 Python
基于梯度爆炸的解决方法:clip gradient
2020/02/04 Python
Django模板标签{% for %}循环,获取制定条数据实例
2020/05/14 Python
Python手动或自动协程操作方法解析
2020/06/22 Python
Python3.8.2安装包及安装教程图文详解(附安装包)
2020/11/28 Python
python爬虫看看虎牙女主播中谁最“顶”步骤详解
2020/12/01 Python
利用CSS3的特性改变文本选中时的颜色
2013/09/11 HTML / CSS
新加坡鲜花速递/新加坡网上花店:Ferns N Petals
2020/08/29 全球购物
测试时代收集的软件测试面试题
2013/09/25 面试题
管理学专业个人求职信范文
2013/12/13 职场文书
法律专业学生的自我评价
2014/02/07 职场文书
模具专业自荐信
2014/05/29 职场文书
建筑工地资料员岗位职责
2015/04/13 职场文书
python批量更改目录名/文件名的方法
2021/04/18 Python
ORACLE查看当前账号的相关信息
2021/06/18 Oracle