JQuery中对服务器控件 DropdownList, RadioButtonList, CheckboxList的操作总结

一： DropDownList
-------------------------------------------------------------------------------------------
在使用 JQuery 进行遍历操作时，
$("input").each(function(i) {
......
}
当操作对象的类型为 dropdownlist时：(备注：在firefox下DropDownList的类型为"select-one")
获得所选中的值： $(this).val(); (如果不是遍历操作时，$(this) 就替换成 $('#控件的Id') )
获取选中的文本： $(this).find("option:selected").text(); 或者 $("#控件的name option:selected").text();
获取选中的索引： $(this).get(0).selectedIndex;
二：RadioButtonList
-------------------------------------------------------------------------------------------
如果页面只有一个RadioButtonList时，可以直接用 $("input[type='radio']:checked").val() 来获得 所选中的值
如果页面有2个或多个RadioButtonList时：
第一步： 取到RadioButtonList控件的Id,设置 var objId=控件Id;
第二步：取到控件的Name, 设置 var radioName = $("input[id^='" + objId + "']").eq(0).attr('name');
第三步：取值
　　获得所选中的值： $("input[name='" + radioName + "']:checked").val());
　　获得所选中的文本： $("input[name='" + radioName + "']:checked+label").text());

三：CheckBoxList
-------------------------------------------------------------------------------------------
判断是否有选中的一个方法，objId为 CheckBoxList的 Id
目前暂时无法用js直接获得服务器控件CheckBoxList的value值，只能通过一些小技巧来实现，例如添加额外的属性
代码中 selectedText 是获得 所选中的文本值，selectedValue 是获得 所选中的值


代码如下:

function hasCheckedByCheckbox(objId) {
var checkedCount = 0;
$("input[id^='" + objId + "']").each(function() {
// var checkName = $(this).attr('name');
// var selectedText = $("input[name='" + checkName + "']:checked+label").text();
// var selectedValue = $(this).parent('span').attr('alt'); //利用hack来实现用js获取checkboxList所选中的值,需要在<asp:ListItem 里添加一个额外的属性 alt
if ($(this).attr('checked')) {
checkedCount++;
}
});
return checkedCount > 0;
}

赞 (0)

相关推荐

  • jquery获取ASP.NET服务器端控件dropdownlist和radiobuttonlist生成客户端HTML标签后的value和text值

    -.获取dropdownlist的text(ddlList为服务器端dropdownlist的ID,生成name属性等于ddlList的select标签) $("#ddlList option:selected").text() 二.获取dropdownlist的value(ddlList为服务器端dropdownlist的ID,生成name属性等于ddlList的select标签) $("#ddlList").val() 三.获取radiobuttonlist的t

  • Jquery中的CheckBox、RadioButton、DropDownList的取值赋值实现代码

    Jquery中的CheckBox、RadioButton、DropDownList的取值赋值实现代码

    由于Jquery的版本更新很快,代码的写法也改变了许多,以下Jquery代码适query1.4版本以上Radio 1.获取选中值,三种方法都可以: $('input:radio:checked').val(): $("input[type='radio']:checked").val(); $("input[name='rd']:checked").val(); 2.设置第一个Radio为选中值: $('input:radio:first').attr('check

  • jQuery实现 RadioButton做必选校验功能

    关于这个问题,百度里说法纷纷,大都无用,或者说版本太老太罗嗦,这里介绍一个可借鉴的用法: 按理说,页面上的若干个Radio Button 在页面加载初始化时,是默认选中第一个的,但总是避免不了一些特殊的需求--所有的单选按钮都不选中,仅当用按钮触发事件时再去做必选校验.例如: <div class="col-xs-4 col-sm-4 col-md-4"> <div class="radio col-mr-20"> @Html.RadioBu

  • 基于jquery自定义的漂亮单选按钮RadioButton

    基于jquery自定义的漂亮单选按钮RadioButton

    继续分享web前端自定义控件,今天所要分享的控件是单选按钮,希望对你有收获,有好的建议也希望能留言给我.代码如下: Html代码如下: 复制代码 代码如下: <div style="margin:50px;float:left;"> <b class="radio" _txt="单选我"></b> <b class="radio" _txt="单选你"><

  • jquery判断RadioButtonList和RadioButton中是否有选中项示例

    复制代码 代码如下: <pre class="html" name="code"> <%--Body 代码--%> <div> <asp:RadioButtonList ID="RadioButtonList1" runat="server"> <asp:ListItem Value="A">a</asp:ListItem> <a

  • jQuery中的RadioButton,input,CheckBox取值赋值实现代码

    1.jquery 获取单选组radio$("input[name='name']:checked").val(); 2.jquery获取radiobutton的下一个值$("input[name='name']:checked").next().text()$("input[name='name']:checked").val() 3.jquery 获取input的值$('#id').val() 4.jquery判断多选框checkbox$(&q

  • jQuery中RadioButtonList的功能及用法实例介绍

    代码分析 复制代码 代码如下: $("#<%= ibSubmit.ClientID%>").click(function() { var flag = true; //alert($("table[id^=ctl]").length); //创建一个checked的arr数组,用于存储每个radiobutton的checked情况 var arr = new Array; $("table[id^=ctl] input[type=radio]&

  • asp.net使用jQuery获取RadioButtonList成员选中内容和值示例

    复制代码 代码如下: <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="Web.Default" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.o

  • JQuery中对服务器控件 DropdownList, RadioButtonList, CheckboxList的操作总结

    一: DropDownList ------------------------------------------------------------------------------------------- 在使用 JQuery 进行遍历操作时, $("input").each(function(i) { ...... } 当操作对象的类型为 dropdownlist时:(备注:在firefox下DropDownList的类型为"select-one") 获

  • 详解jQuery中的元素的属性和相关操作

    元素属性 元素的属性中可以包含很多有用的信息,所以如何设置或得到属性中的值,就显得非常重要. jQuery 的 $.fn.attr 方法可以作为 setter 和 getter 使用,用来设置或获取属性的值.和 $.fn.css 用法类似,$.fn.attr 既可一次性接受单个属性,也可以接受多个属性(对象) : $('a').attr('href', 'allMyHrefsAreTheSameNow.html'); $('a').attr({ 'title' : 'all titles are

  • jquery中each循环的简单回滚操作

    话不多说,请看代码: var ispass = true; var obj = new Object(); $.each(data,function(i,td){ var sum=data[i].sum; var num=data[i].num; var id=data[i].num; if(num>sum){ ispass=false; alert("数量不能大于总数量!"); sum+=num; return false; } obj[id]=sum; }) if(!ispa

  • jquery中如何获得服务器控件实现思路

    jquery中 复制代码 代码如下: $("#<%=StoreName.ClientID %>").focus(function() { $("#<%=Label5.ClientID %>").val("请输入真实的店铺名称"); $("#<%=Label5.ClientID %>").css("color", "#666"); }); html中 复

  • jQuery中过滤器的基本用法示例

    jQuery中过滤器的基本用法示例

    本文实例讲述了jQuery中过滤器的基本用法.分享给大家供大家参考,具体如下: HTML正文: <input type="button" id="b1" value="偶数行红色"><br> <input type="button" id="b2" value="奇数行绿色"><br> <table border=1 width=&q

  • jQuery中extend函数简单用法示例

    jQuery中extend函数简单用法示例

    本文实例讲述了jQuery中extend函数简单用法.分享给大家供大家参考,具体如下: var result=$.extend({},item,item1); extend给对象添加新的属性:js插件经常使用来配置参数 {}:item和item1合并后的结果 item:默认属性 item1:新增属性,如果item1和item属性重合则会覆盖item1中的属性 <span id="Test"></span> var item={"name":&

  • JQuery中each()的使用方法说明

    JQuery中each()的使用方法说明

    each()函数是基本上所有的框架都提供了的一个工具类函数,通过它,你可以遍历对象.数组的属性值并进行处理.jQuery和jQuery对象都实 现了该方法,对于jQuery对象,只是把each方法简单的进行了委托:把jQuery对象作为第一个参数传递给jQuery的each方法.换句话 说:jQuery提供的each方法是对参数一提供的对象的中所有的子元素逐一进行方法调用.而jQuery对象提供的each方法则是对jQuery内 部的子元素进行逐个调用. each函数根据参数的类型实现的效果不完

  • jquery中的ajax异步上传

    找了好久终于在网上找到了ajax异步上传文件的方法,不过网上大多数是php的 ,我改为struts2写的 大同小异,希望对学习java的人有一定的帮助.我上传的是音乐文件. ajaxfileupload.js这个js文件是主要文件,一定要导入. jsp页面 ,其中我还做了div的隐藏***************************** <%@ page language="java" import="java.util.*" pageEncoding=&

  • 解析prototype,JQuery中跳出each循环的方法

    复制代码 代码如下: function chk(){        var flag=true;        var msg='';        var tips={'username':'姓名','tel':'电话','company':'公司名称','loupan_name':'楼盘名','sdate':'团购时间','content_1':'团购内容'};        $$('.required').each(function(el){            if($F(el).bl

  • jQuery中prevAll()方法用法实例

    本文实例讲述了jQuery中prevAll()方法用法.分享给大家供大家参考.具体分析如下: 此方法查找匹配元素集合之前所有的同辈元素. 同辈元素集合可以通过选择器进行筛选. 语法结构: 复制代码 代码如下: $("selector").prevAll(expr) 参数列表: 参数 描述 expr 可选.用于过滤的表达式. 实例代码: 实例一: 复制代码 代码如下: <!DOCTYPE html> <html> <head> <meta cha

随机推荐