欢迎光临
我们一直在努力

jquery怎么对标签添加只读或禁用属性

这篇文章主要介绍了jquery怎么对标签添加只读或禁用属性的相关知识,内容详细易懂,操作简单快捷,具有一定借鉴价值,相信大家阅读完这篇jquery怎么对标签添加只读或禁用属性文章都会有所收获,下面我们一起来看看吧。

一、jQuery 

  • jQuery 是一个 JavaScript 库。

  • jQuery 极大地简化了 JavaScript 编程。

  • jQuery 很容易学习。

实例:

$(document).ready(function(){
  $("p").click(function(){
    $(this).hide();
  });
});

源码:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"> 
<title>菜鸟教程(runoob.com)</title> 
<script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js">
</script>
<script>
$(document).ready(function(){
  $("p").click(function(){
    $(this).hide();
  });
});
</script>
</head>
<body>
<p>如果你点我,我就会消失。</p>
<p>继续点我!</p>
<p>接着点我!</p>
</body>
</html>

运行结果:

上图运行结果只要点击文字就会消失,感兴趣的小伙伴可以下去试一下

二、关于readonly属性

例1、jquery 设置readonly属性

$('input').attr("readonly","readonly") //将input元素设置为readonly
$('input').removeAttr("readonly"); //去除input元素的readonly属性
  
if($('input').attr("readonly") == true)//判断input元素是否已经设置了readonly属性

例2、对于为元素设置readonly属性和取消readonly属性的方法

$('input').attr("readonly",true)//将input元素设置为readonly
$('input').attr("readonly",false)//去除input元素的readonly属性
 
$('input').attr("readonly","readonly")//将input元素设置为readonly
$('input').attr("readonly","")//去除input元素的readonly属性

三、jquery 设置disabled属性

例1、jquery 设置disabled属性

$('input').attr("disabled","disabled")//将input元素设置为disabled
$('input').removeAttr("disabled");//去除input元素的disabled属性
  
if($('input').attr("disabled")==true)//判断input元素是否已经设置了disabled属性

例2、对于为元素设置disabled属性和取消disabled属性的方法

$('input').attr("disabled",true)//将input元素设置为disabled
$('input').attr("disabled",false)//去除input元素的disabled属性
 
$('input').attr("disabled","disabled")//将input元素设置为disabled
$('input').attr("disabled","")//去除input元素的disabled属性

四、jquery动态添加文本框的readonly只读属性

<input id="test" type="text"  />
 
 $("#test").attr({"readonly":"readonly"}); //添加readonly属性
 // 或者
 $("#ID").attr({ readonly: 'true' });

 $("#test").removeAttr("readonly");    //去除readonly属性

关于“jquery怎么对标签添加只读或禁用属性”这篇文章的内容就介绍到这里,感谢各位的阅读!相信大家对“jquery怎么对标签添加只读或禁用属性”知识都有一定的了解,大家如果还想学习更多知识,欢迎关注云搜网行业资讯频道。

赞(0)
【声明】:本博客不参与任何交易,也非中介,仅记录个人感兴趣的主机测评结果和优惠活动,内容均不作直接、间接、法定、约定的保证。访问本博客请务必遵守有关互联网的相关法律、规定与规则。一旦您访问本博客,即表示您已经知晓并接受了此声明通告。