• 技术文章 >web前端 >前端问答

    jquery怎么判断元素是否只读

    青灯夜游青灯夜游2022-09-13 18:22:40原创179

    判断步骤:1、使用attr()获取指定元素中readonly属性的值,语法“$("选择器).attr("readonly")”;2、判断readonly属性的值是否为“readonly”,语法“属性值=="readonly"”,如果属性值为“readonly”则元素只读,反之则元素不只读。

    大前端成长进阶课程:进入学习

    本教程操作环境:windows7系统、jquery3.6.1版本、Dell G3电脑。

    HTML 只读状态

    元素是否只读,是只读属性readonly属性控制的。

    jquery判断元素是否只读

    在jquery中,可以通过检查readonly属性的值来判断元素是否只读

    实现步骤:

    步骤1:使用attr()获取指定元素中readonly属性的值

    attr() 方法可以返回被选元素的指定属性值

    $("选择器).attr("readonly")

    步骤2:判断readonly属性的值是否为“readonly”

    if(属性值=="readonly"){
    	console.log("元素只读");
    }else{
    	console.log("元素不只读");
    }

    示例代码:

    <!DOCTYPE html>
    <html>
    
    	<head>
    		<meta charset="UTF-8">
    		<script src="js/jquery-3.6.1.min.js"></script>
    		<script type="text/javascript">
    			$(document).ready(function() {
    				$("button").click(function() {
    					var a = $("input").attr("readonly");
    					if (a == "readonly") {
    						console.log("input元素只读");
    					} else {
    						console.log("input元素不只读");
    					}
    					var b = $("textarea").attr("readonly");
    					if (b == "readonly") {
    						console.log("textarea元素只读");
    					} else {
    						console.log("textarea元素不只读");
    					}
    				});
    			});
    		</script>
    	</head>
    	<body>
    		<input type="text" value="hello" readonly="readonly" /><br /><br />
    		<textarea></textarea><br /><br />
    		<button>元素是否只读</button>
    	</body>
    </html>

    1.gif

    【推荐学习:jQuery视频教程web前端视频

    以上就是jquery怎么判断元素是否只读的详细内容,更多请关注php中文网其它相关文章!

    声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn核实处理。
    专题推荐:jquery
    上一篇:jquery怎么点击其他元素隐藏div元素 下一篇:2.0版本的jquery支不支持ie8
    VIP课程(WEB全栈开发)

    相关文章推荐

    • ❤️‍🔥共22门课程,总价3725元,会员免费学• jquery+swiper实现时间轴tab滑动切换显示效果• jquery ajax怎么改成同步• jquery怎么获取元素有几个子元素• jquery中on方法的优势是什么• jquery可以获取链接的内容吗
    1/1

    PHP中文网