`

jquery日常总结

 
阅读更多

1.checkbox操作

1.判断 有id的单个checkbox是否被选中

方法一 用attr属性

$("#showPoint").attr("checked")=="checked" 注意此处返回的是checked or undefined

方法二 用is方法
$("#showPoint").is(":checked")==true 注意此处返回的是true or false

<input type="checkbox" id="showPoint" name="showPoint" checked>

2.checkbox的全选/取消全选以及取选中个数

全选

$("input[type=checkbox][name=stuIds]").attr("checked","true");

取消全选

$("input[type=checkbox][name=stuIds]").removeAttr("checked");

取选中的个数

$("input[type=checkbox][name=stuIds]:checked").length

2.radio操作

1.取被选中的radio的值

$("input[type='radio'][name='radiotest']:checked").val() 当没有选中任务一个时 undefined 选中了一个就取到他的value值

<input type="radio" name="radiotest" value="1" >
<input type="radio" name="radiotest" value="2" >

 

3.select操作

1.取select选中的text

$(#selecttest option:selected').text();
或$("#selecttest").find('option:selected').text();

 

2.取select选中的value值
或$("#testSelect").val();

 

<select id="selecttest" name="selecttest" >
    <option value="">--请选择--</option>
    <option value="123">--123--</option>
    <option value="456">--456--</option>
</select>

 3.清空重置select框

 

$("#subjectId").empty(); 清空select

//重置select
$("#subjectId").append("<option value=''>--请选择--</option>");

sublist是一个列表
if(null!=sublist){
     for(var i=0;i<sublist.length;i++){
     jQuery("#subjectId").append("<option value='"+sublist[i].id+"' title='"+sublist[i].subjectName+"'>"+sublist[i].subjectName+"</option>");
      }
}

 <select name="subjectId" id="subjectId" onChange="doQuery();" class="input-sel100">
    <option value="">--请选择--</option>
 </select>

 

4.iframe操作

取得同个窗口下的其他iframe里的元素值

例子 取 iframe id=listFrame的 中的 id为showPoint的checkbox框 并判断是否被选中

jQuery("#listFrame").contents().find("#showPoint").attr("checked")=="checked" 

 

1. 在父窗口中操作 选中IFRAME中的所有单选钮
$(window.frames["iframe1"].document).find("input:radio").attr("checked","true");

2. 在IFRAME中操作 选中父窗口中的所有单选钮
$(window.parent.document).find("input:radio").attr("checked","true");

父窗口想获得IFrame中的Iframe,就再加一个frames子级就行了,如:
$(window.frames["iframe1"].frames["iframe2"].document).find("input:radio").attr("checked","true");

 

5.跨iframe checkbox操作

声明一个ids数组用来存放被选中的checkbox的value的数组

var ids = new Array();
 var j=0;

然后取id=rightFrame的iframe里的name=ids 类型是checkbox 的选中的元素数组
 var chk = jQuery("#rightFrame").contents().find("input[type='checkbox'][name='ids']:checked");

最后把元素数组的value值赋值给ids数组
 for(var i=0;i<chk.length;i++){
  if(chk[i].checked){
   ids[j]=chk[i].value;
   j++
  }
 } 

 

分享到:
评论

相关推荐

    jQuery日常使用总结

    这些只是jQuery日常使用的一部分,jQuery还提供了丰富的API和插件,如选择器、动画效果、AJAX请求等,能够极大地提高开发效率。学习并熟练掌握jQuery,将有助于你更好地构建交互性强、用户体验良好的Web应用。

    jquery开发文档

    **jQuery 开发文档详解*...总结,这个“jQuery开发文档”是开发者日常工作的得力助手,无论是初学者还是经验丰富的开发者,都能从中受益。通过深入理解和熟练运用这些知识点,可以显著提升JavaScript编程的效率和质量。

    jquery-ui-1.9.2.(免费)

    总结来说,jQuery UI 1.9.2是JavaScript开发者构建交互式界面的得力工具。它提供了丰富的组件,易于定制,同时兼顾性能和无障碍性。无论是新手还是经验丰富的开发者,都可以通过学习和掌握jQuery UI,提升网页应用的...

    jQuery速成小例子

    总结这个"jQuery速成小例子",它涵盖了jQuery的基础知识,包括选择器的使用、DOM操作、事件处理、动画效果、AJAX请求以及迭代器的运用。通过学习和实践这些例子,开发者可以快速掌握jQuery的基本技能,为日常的前端...

    jquery 精品教程 -- Learning JQuery

    1. **Jonathan Chaffer**:作为Structure Interactive公司的首席技术官,他负责监督使用各种技术进行的Web开发项目,并积极参与日常编程任务。 2. **Karl Swedberg**:不仅是本书的作者之一,还担任了封面设计工作...

    [jQuery实战第二版].jQuery.in.Action.2nd.Edition

    ### 知识点总结 #### 一、书籍基本信息 - **书名**:《jQuery实战》第二版(jQuery in Action, 2nd Edition) - **作者**:Bear Bibeault 和 Yehuda Katz - **出版商**:Manning Publications - **涵盖版本**:...

    jquery入门(一)

    总结,jQuery以其简洁的语法和丰富的功能,成为前端开发者的得力助手。通过学习和实践,可以快速提高JavaScript编程效率,打造更流畅的用户体验。在后续的学习中,将进一步探讨更高级的jQuery技巧和应用。

    前端项目-jquery-te.zip

    总结来说,jQuery-TE 是一款优秀的前端文本编辑器解决方案,它的轻量级设计和丰富的功能使得在不牺牲性能的前提下,能够快速搭建起具有专业编辑功能的网页应用。对于那些希望避免大框架复杂性的开发者而言,jQuery-...

    JQuery选择器总结(3)

    **jQuery选择器总结(3)** 在Web开发中,jQuery是一个强大的JavaScript库,极大地简化了DOM操作、事件处理以及动画效果。本篇文章将重点聚焦于jQuery的选择器,这是jQuery库中的核心部分,它使得我们能够高效地选取...

    jQuery树插件演示族谱Family tree和日程安排

    总结,jQuery树插件在构建族谱和日程安排中发挥着重要作用。通过合理选择和配置插件,我们可以创建出功能强大且易于使用的Web应用,满足用户在记录和管理家庭关系及日常活动上的需求。同时,随着前端技术的发展,...

    jquery学习总结(超级详细)

    通过上述知识点的学习,可以更加熟练地在日常开发中运用jQuery来提高开发效率和页面的交互体验。对于想要深入学习jQuery的开发者,建议进一步阅读jQuery的官方文档,以获得更加全面和系统的知识。

    jQuery学习心得总结(必看篇).docx

    ### jQuery学习心得总结 #### 一、jQuery简介与特点 jQuery 是一款优秀的 JavaScript 库,它的出现极大地简化了 HTML 文档遍历、事件处理、动画以及 Ajax 交互等操作。自2006年发布以来,jQuery 已经成为了前端...

    jQuery API 速查表帮助文档.chm

    总结来说,“jQuery API 速查表帮助文档”是一个全面且实用的参考资料,无论你是初学者还是经验丰富的开发者,都能从中受益。它覆盖了jQuery的各个方面,从基础操作到高级功能,为日常开发工作提供了极大的便利。...

    jquery学习文档

    ### jQuery学习文档详解 ...通过这些内容,读者不仅可以了解jQuery的基本特性,还能掌握如何利用jQuery简化日常的Web开发任务。对于初学者而言,这是一个很好的起点,为后续深入学习jQuery提供了坚实的基础。

    jQuery简单带记事功能的日历插件

    **总结** e-calendar日历插件利用jQuery的强大功能,为用户提供了一个简单而实用的记事工具。通过调整插件参数,开发者能够定制日历的视觉效果,适应不同的网站环境。这个插件的记事功能和自定义外观使其成为网站和...

    jQuery常用知识点总结以及平时封装常用函数

    ### jQuery常用知识点总结以及平时封装常用函数 jQuery是一个快速、小巧、功能丰富的JavaScript库,它通过封装和简化DOM操作、事件处理、动画和Ajax交互,极大地提升了网页开发的效率。本文将详细介绍jQuery中的...

    JQuery新浪1630个表情插件.zip

    总结来说,JQuery新浪1630个表情插件为Web开发者提供了一种便捷的方式,将丰富的表情功能整合到网页应用中,提升了用户的交流体验。无论是社交媒体平台、论坛还是博客系统,都可以借助这个插件增强其互动性和趣味性...

    jquery easy ui 离线API文档

    总结,jQuery Easy UI离线API文档是开发者不可或缺的工具,它涵盖了所有组件的详细信息,帮助我们更好地理解和运用这个框架。同时,深入研究其CSS设计,能提升我们的界面设计水平,打造出更具吸引力的Web应用。

    前端项目-jquery.terminal.zip

    **前端项目 - jQuery 终端模拟器** 在前端开发中,有时我们需要为用户创建一个交互式的命令行界面,类似于...无论是在教学、测试还是日常应用中,jQuery Terminal 都能发挥出其独特的作用,为开发者提供更多的可能性。

Global site tag (gtag.js) - Google Analytics