a标签（普通标签如span）没有disabled属性 ，怎样利用js实现该属性
a标签以及其她普通标签没有disabled属性，要想实现类似input框属性disabled可以通过css样式设置pointer-events的值来设定：
<!DOCTYPE html>
<html>
<head>
<title>a onclick disabled</title>
<script src="./js/jquery.min.js" type="text/javascript" charset="utf-8"></script>
</head>
<body>
<div class="body">
<a class="page-next" href="javascript:void(0)">aAlert</a>
<br />
<span class="pre">spanAlert</span>
<br />
<input type="button" onclick="disableFn()" value="chageDisabled"/>
<input type="button" onclick="ableFn()" value="chageAbled"/>
</div>
<script type="text/javascript">
$(document).ready(function(){
$('.page-next').click(function(e){
e.preventDefault();
alert('aaaaaaaaaaaa');
})
$('.pre').click(function(e){
e.preventDefault();
alert('span span span');
}) })
function disableFn(){
$('.page-next').attr('disabled',true);
$('.page-next').css('pointer-events','none'); $('.pre').attr('disabled',true);
$('.pre').css('pointer-events','none')
alert('change success');
}
function ableFn(){
$('.page-next').attr('disabled',false);
$('.page-next').css('pointer-events','auto'); $('.pre').attr('disabled',false);
$('.pre').css('pointer-events','auto')
alert('change success');
}
</script>
</body> </html>
pointer-events属性：
- auto：与pointer-events属性未指定时的表现效果相同。在svg内容上与
visiblepainted值相同 - none：元素永远不会成为鼠标事件的target。但是，当其后代元素的pointer-events属性指定其他值时，鼠标事件可以指向后代元素，在这种情况下，鼠标事件将在捕获或冒泡阶触发父元素的事件侦听器。
- 其他值只能应用在SVG上。
说明：
- 使用
pointer-events来阻止元素成为鼠标事件目标不一定意味着元素上的事件侦听器永不会触发。如果元素后代明确指定了pointer-events属性并允许其成为鼠标事件的目标，那么指向该元素的任何事件在事件传播过程中都将通过父元素，并以适当的方式触发其上的事件侦听器。当然位于屏幕上在父元素上但不在后代元素上的鼠标活动都不会被父元素和后代元素捕获（将会穿过父元素而指向位于其下面的元素）。 - 对应的脚本特性为pointerEvents。
注意; pointer-envents:none 若用在input框上时 input框 按tab键仍然是可编辑的 ，而且由于父子元素的关系很多时候连续点击仍然是可编辑的，若想该input框不能编辑，还需要设置 readOnly=“readOnly”
pointer-events属性详见：http://www.css88.com/book/css/properties/user-interface/pointer-events.htm
a标签（普通标签如span）没有disabled属性 ，怎样利用js实现该属性的更多相关文章
- 让HTML标签、DIV、SPAN拥有focus事件和blur事件，聚焦和失焦
DIV和其他普通标签是不具有onfocus和onblur事件的.INPUT和A标签为什么拥有?而DIV和SPAN等普通标签却没有?有时候我们习惯性用键盘的TAB来移动光标,仔细看你会发现,光标只在IN ...
- 真正让HTML标签、DIV、SPAN拥有onfocus和onblur，聚焦和失焦
转载:http://blog.sina.com.cn/s/blog_7dfe67db01010lnq.html 默认火狐或者其他浏览器里DIV和其他普通标签是不具有onfocus和onblur事件的, ...
- python 全栈开发，Day46(列表标签,表格标签,表单标签,css的引入方式,css选择器)
一.列表标签 列表标签分为三种. 1.无序列表<ul>,无序列表中的每一项是<li> 英文单词解释如下: ul:unordered list,“无序列表”的意思. li:lis ...
- 区别CSS中display：box；inline；none以及HTML中 <frame> 标签<table> 标签的 frame 属性
区别display:box:display:inline:display:none三者的不同 display:block的特点是: block是Display默认的值.总是在新行上开始:该对象随后的内 ...
- python 全栈开发，Day45(html介绍和head标签,body标签中相关标签)
一.html介绍 1.web标准 web准备介绍: w3c:万维网联盟组织,用来制定web标准的机构(组织) web标准:制作网页遵循的规范 web准备规范的分类:结构标准.表现标准.行为标准. 结构 ...
- 前端 HTML body标签相关内容 常用标签 盒子标签 div
盒子标签 div <div>可定义文档的分区 division的缩写 译:区 <div> 标签可以把文档分割为独立的.将他们进行分区 div在浏览器中,默认是不会增加任何的效果 ...
- JSP自定义标签（标签处理器 tld文件）
标签的形式如下,标签处理器就是处理JSP页面中的标签的属性和内容,定义好之后就跟使用JSTL一样 <标签名 属性名="属性值" 属性名="属性值"> ...
- 前端基础-html 字体标签,排版标签,超链接,图片标签
主要内容: 字体标签: h1~h6.<font>.<u>.<b>.<strong><em>.<sup>.<sub> ...
- 前端基础-html 列表标签,表格标签,表单标签
一.列表标签 1.ul(无序列表)标签 ul(unordered list)无序列表,ul下的子元素只能是li(list item),如下示例: <ul> <li>第一项< ...
随机推荐
- Redis入门到高可用（七）——Hash
一.结构 Mapmap结构: filed 不能相同,value可以相同. 二.重要指令 ♦️ HSET ♦️ HGET ♦️ HDEL ♦️ Hlen ♦️ HEXISTS ♦️HGETALL ...
- mac chrome 浏览器开启允许跨域
在控制台输入下面代码: open -n /Applications/Google\ Chrome.app/ --args --disable-web-security --user-data-dir ...
- SVM高斯核为何会将特征映射到无穷维？【转载】
转自:https://www.zhihu.com/question/35602879 1.问题: SVM中,对于线性不可分的情况下,我们利用升维,把低维度映射到到维度让数据变得“更可能线性可分”,为了 ...
- 【UML】NO.48.EBook.5.UML.1.008-【UML 大战需求分析】- 组件图（Component Diagram）
1.0.0 Summary Tittle:[UML]NO.48.EBook.1.UML.1.008-[UML 大战需求分析]- 组件图(Component Diagram) Style:DesignP ...
- Spring Hibernate Transaction示例
JDBCDAO.java package com.bf; import java.sql.ResultSet; import java.sql.SQLException; import java.ut ...
- CLR总览
Contents 第1章CLR的执行模型... 4 1.1将源代码编译成托管代码模块... 4 1.2 将托管模块合并成程序集... 6 1.3加载公共语言运行时... 7 1.4执行程序集的代码.. ...
- js 图片区域可点击，适配移动端，图片大小随意改变
实现图片区域可点击,实际上使用map是可以的,但是适配效果并不好,图片只能是固定大小的值,而且点都被写死了. 在这里,我使用的js基于canvas写的一个小工具.可以圈出你需要点击的部分,然后生成一串 ...
- python 参数解析ArgumentParser
#!/usr/bin/env python #coding:utf-8 from argparse import ArgumentParser #--------------------------- ...
- Python实现selenium回放时间设置
一般在做selenium时会有,回放快慢的需求. 实现思路: 1.一般写selenium会自定义findelement函数,来实现查找元素. 2.在查找函数上加个睡眠时间的装饰器,函数执行完等待若干秒 ...
- windows 服务器硬盘的分区
进入Server 2012的操作系统,打开CMD框,输入:diskmgmt.msc,回车. 操作完第一步后会弹出“磁盘管理”的框.鼠标右键点击红框所在位置,选中“压缩卷”. 在“输入压缩空间量(MB) ...