Loading [MathJax]/jax/output/CommonHTML/config.js
前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >专栏 >Jquery 判断 checked 是否选中

Jquery 判断 checked 是否选中

作者头像
White feathe
发布于 2021-12-08 07:13:45
发布于 2021-12-08 07:13:45
2.8K00
代码可运行
举报
运行总次数:0
代码可运行

如果要判断Js中的 checked 是否选中,首先取决于你 引用Jquery 的版本。

首先,我引用的是 jQuery v1.11.2 的版本出现的效果如下:

(建议:选用 jquery-1.8.3.min.js 会比较稳定点)

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
    </head>
    <body>
        <input type="checkbox" name = "abc" id="aaa" />
    </body>
    <script src="build/jquery.min.js"></script>
    <script>
        $(function(){

            //都是获取元素是否选中

            alert( $("input[name='abc']:checked").val());    //undefined

            alert( $("input[name='abc'][checked]").val());   //undefined

            alert($("#aaa").attr("checked"));       //undefined

            alert($(":checkbox:checked").checked)   //undefined

            alert($("#aaa").prop("checked"));      //true

            alert($(":checkbox").get(0).checked);  //true


        });
    </script>
</html>

1、获取匹配集合中第一个元素的Property的值

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
.prop( propertyName ) 

2、 给匹配元素集合设定一个或多个属性

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
.prop( propertyName, value ) 
.prop( map ) 
.prop( propertyName, function(index, oldPropertyValue) ) 

.prop()和 .attr()区别

prop是Jquery 从1.6开始提供新的方法。

To retrieve and change DOM properties such as the checked, selected, or disabled state of form elements, use the .prop() method.

根据官方的建议:具有 true 和 false 两个属性的属性,如 checked, selected 或者 disabled 使用prop(),其他的使用 attr()

那么,什么时候使用attr(),什么时候使用prop()?

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
1.添加属性名称该属性就会生效应该使用prop();

2.是有true,false两个属性使用prop();

3.其他则使用attr();

项目中jquery升级的时候要注意这点!


参考文献: http://hxq0506.iteye.com/blog/1046334

本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2016/04/27 ,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
暂无评论
推荐阅读
编辑精选文章
换一批
jQuery.prop , jQuery.attr ,jQuery.data
jquery.prop 获取匹配的元素中第一个元素特定的属性值,或者是设置多个元素的属性值。
_淡定_
2018/08/24
4K0
jQuery就业课程之表单选择器系列
求同存异,利用之前的知识,迁移过来。判断的是表单的类型,注意,判断的是表单元素的类型,类型,类型。
张哥编程
2024/12/19
1610
与Ajax同样重要的jQuery(2)
练习9: ² 点击button 打印radio checkbox select 中选中项的值 <script type="text/javascript" src="../jquery-1.8.3.min.js"></script> <script type="text/javascript"> $(function(){ // 点击button 打印radio checkbox select 中选中项的值 $("#mybutton").click(function(){ // 打印选中性别的值 $("in
Java帮帮
2018/03/19
6.3K0
与Ajax同样重要的jQuery(2)
[Java面试九]脚本语言知识总结.
核心内容概述 1.JavaScript加强,涉及到ECMAScript语法、BOM对象、DOM对象以及事件。 2.Ajax传统编程。 3.jQuery框架,九种选择器为核心学习内容 4.JQuery UI插件 5.jQuery Ajax编程 6.jQuery第三方插件 7.反向Ajax编程(彗星) 一、JavaScript基础加强 JavaScript是在浏览器内容运行,无需编译、解释执行动态脚本语言,是一种弱类型语言,所有变量使用var定义。 JavaScript的3个组成部分分别为:核心(ECMAScr
一枝花算不算浪漫
2018/05/18
5.2K0
js jquery 基本元素操作
下载:https://github.com/danielm/uploader/archive/master.zip 立即下载
WindWant
2020/09/11
3.5K0
js jquery 基本元素操作
一文玩转jQuery+Ajax
简介:jQuery 是一个轻量级的"写的少,做的多"的 JavaScript 库。
岳泽以
2023/04/27
4.1K0
一文玩转jQuery+Ajax
jQuery
    2.jQuery使用户能够更方便地处理HTML Document、Events、实现动画效果、方便地进行Ajax交互,能够极大地简化JavaScript编程。它的宗旨就是:“Write less, do more.“
changxin7
2022/05/06
9.1K0
jQuery
jQuery基础
一、jQuery是什么? jQuery是一个轻量级的、兼容多浏览器的JavaScript库。 jQuery使用户能够更方便地处理HTML Document、Events、实现动画效果、方便地进行Ajax交互,能够极大地简化JavaScript编程。它的宗旨就是:“Write less, do more.“ 二、为什么要用jQuery? 一款轻量级的JS框架。jQuery核心js文件才几十kb,不会影响页面加载速度。 丰富的DOM选择器,jQuery的选择器用起来很方便,比如要找到某个DO
人生不如戏
2018/04/12
2K0
jQuery基础
一 jQuery是什么? [1]   jQuery由美国人John Resig创建,至今已吸引了来自世界各地的众多 javascript高手加入其team。 [2]   jQuery是继prototype之后又一个优秀的Javascript框架。其宗旨是——WRITE LESS,DO MORE! [3]  它是轻量级的js库(压缩后只有21k) ,这是其它的js库所不及的,它兼容CSS3,还兼容各种浏览器 [4]  jQuery是一个快速的,简洁的javaScript库,使用户能更方便地处理HTMLdo
用户1214487
2018/01/24
2.1K0
利用JQuery操作form表单,例如:text,radis,checkbox,file等等之类的
摘要总结:本文主要介绍了在JavaScript中,如何使用jQuery和Ajax进行表单(Form)验证,以增强用户体验。主要包括了表单验证、用户输入限制、Ajax异步请求、Ajax返回数据和格式化表单等内容。
林老师带你学编程
2018/01/04
2.2K0
利用JQuery操作form表单,例如:text,radis,checkbox,file等等之类的
jquery教程之属性操作函数
prop 是针对元素本身就带有的固有属性,比如id class title name checked等
老雷PHP全栈开发
2020/07/02
8160
Web阶段:第五章:JQuery库
点击:API文档下载 Jquery介绍 1.什么是JQuery ? jQuery,顾名思义,也就是JavaScript和查询(Query),它就是辅助JavaScript开发的js类库。 2.JQue
Java廖志伟
2022/09/28
26.5K0
Web阶段:第五章:JQuery库
JQuery基础学习
JQuery是一个快速、简洁的JavaScript框架,是继Prototype之后又一个优秀的JavaScript代码库(或JavaScript框架)。jQuery设计的宗旨 是“write Less,Do More”,即倡导写更少的代码,做更多的事情。它封装JavaScript常用的功能代码,提供一种简便的JavaScript设计模式,优化HTML文档操作、事件处理、动画设计和Ajax交互。
乐心湖
2021/01/18
3.8K0
Web-第四天 jQuery学习
jQuery是一个JavaScript框架。它兼容CSS3,还兼容各种浏览器。文档说明很全,应用详细,成熟插件多。
Java帮帮
2018/07/27
3.6K0
Web-第四天 jQuery学习
jquery中dom元素的attr和prop方法的理解
  在编写使用高版本[ jQuery 1.6 开始新增了一个方法 prop()]的jquery插件进行编写js代码的时候,经常不知道dom元素的attr和prop方法到底有什么区别?各自有什么应用场景,什么时候使用attr方法更合适?什么时候使用prop方法更加方便?今天我就结合自己平常的使用来谈谈这些问题以及我个人的理解。
阿豪聊干货
2018/08/09
1.3K0
javaWeb核心技术第五篇之jQuery
- 概述 - jQuery是一个优秀的javascript框架(js类库),兼容css3和各大浏览器,提供dom,events,animate,ajax等简易的操作。并且jQuery有非常丰富的插件,大多数功能都有相应的插件解决方案。jQuery的宗旨是write less, do more. (写的更少,做的更多) - jQuery入门 - jQuery和html整合 - 下载 - 下载地址:www.jquery.com - 使用script的src属性即可
海仔
2019/08/26
8.1K0
03-老马jQuery教程-DOM操作(上)
根据文章内容总结摘要。
老马
2017/12/27
1.7K0
jQuery
jQuery基础 1、    jQuery其实就是一个类库,集成了DOM/BOM/JavaScript的类库 http://jquery.cuishifeng.cn/这个网站里有所有的jQuery
coders
2018/01/04
4.7K0
jQuery
JQuery的学习
JQuery基础: 1. 概念: * 一个JavaScript框架,简化JS开发。 * jQuery是一个快速、简洁的JavaScript框架,是继Prototype之后又一个优秀的JavaScript代码库(或JavaScript框架)。jQuery设计的宗旨是“write Less,Do More”,即倡导写更少的代码,做更多的事情。它封装JavaScript常用的功能代码,提供一种简便的JavaScript设计模式,优化HTML文档操作、事件处理、动画设计和Ajax交互。 * JavaScript
Rochester
2020/09/01
16.8K0
jQuery/JS判断/设置checkbox的选中状态
项目中经常遇到 checked 选中的问题,可以通过 JS 或者 jQuery 实现。
德顺
2019/11/12
18.9K0
相关推荐
jQuery.prop , jQuery.attr ,jQuery.data
更多 >
领券
💥开发者 MCP广场重磅上线!
精选全网热门MCP server,让你的AI更好用 🚀
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档
本文部分代码块支持一键运行,欢迎体验
本文部分代码块支持一键运行,欢迎体验