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上。

说明：

设置或检索在何时成为属性事件的target。

  • 使用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实现该属性的更多相关文章

  1. 让HTML标签、DIV、SPAN拥有focus事件和blur事件，聚焦和失焦

    DIV和其他普通标签是不具有onfocus和onblur事件的.INPUT和A标签为什么拥有?而DIV和SPAN等普通标签却没有?有时候我们习惯性用键盘的TAB来移动光标,仔细看你会发现,光标只在IN ...

  2. 真正让HTML标签、DIV、SPAN拥有onfocus和onblur，聚焦和失焦

    转载:http://blog.sina.com.cn/s/blog_7dfe67db01010lnq.html 默认火狐或者其他浏览器里DIV和其他普通标签是不具有onfocus和onblur事件的, ...

  3. python 全栈开发，Day46(列表标签,表格标签,表单标签,css的引入方式,css选择器)

    一.列表标签 列表标签分为三种. 1.无序列表<ul>,无序列表中的每一项是<li> 英文单词解释如下: ul:unordered list,“无序列表”的意思. li:lis ...

  4. 区别CSS中display：box；inline；none以及HTML中 <frame> 标签<table> 标签的 frame 属性

    区别display:box:display:inline:display:none三者的不同 display:block的特点是: block是Display默认的值.总是在新行上开始:该对象随后的内 ...

  5. python 全栈开发，Day45(html介绍和head标签,body标签中相关标签)

    一.html介绍 1.web标准 web准备介绍: w3c:万维网联盟组织,用来制定web标准的机构(组织) web标准:制作网页遵循的规范 web准备规范的分类:结构标准.表现标准.行为标准. 结构 ...

  6. 前端 HTML body标签相关内容 常用标签 盒子标签 div

    盒子标签 div <div>可定义文档的分区 division的缩写 译:区 <div> 标签可以把文档分割为独立的.将他们进行分区 div在浏览器中,默认是不会增加任何的效果 ...

  7. JSP自定义标签（标签处理器 tld文件）

    标签的形式如下,标签处理器就是处理JSP页面中的标签的属性和内容,定义好之后就跟使用JSTL一样 <标签名 属性名="属性值" 属性名="属性值"> ...

  8. 前端基础-html 字体标签,排版标签,超链接,图片标签

    主要内容: 字体标签: h1~h6.<font>.<u>.<b>.<strong><em>.<sup>.<sub> ...

  9. 前端基础-html 列表标签,表格标签,表单标签

    一.列表标签 1.ul(无序列表)标签 ul(unordered list)无序列表,ul下的子元素只能是li(list item),如下示例: <ul> <li>第一项< ...

随机推荐

  1. Redis基本管理

    Redis介绍 开源 内存存储 数据结构存储  1.字符串(数字)    2.列表    3.hash    4.set 集合   5.sorted set 有序集合 用途 :数据库  缓存  消息队 ...

  2. Building an (awesome) API with NancyFX 2.0 + Dapper

    http://blog.nandotech.com/post/2016-10-25-nancyfx-webapi-dapper/?utm_source=tuicool&utm_medium=r ...

  3. jenkins openshift 持续集成

    参数部分没有 不要照抄,只供参考 需求: CI利用confd+etcd生成配置文件 CI把git的COMMIT 传到openshift的buildconfigs #!/bin/bash echo ec ...

  4. [LeetCode] 613. Shortest Distance in a Line_Easy tag: SQL

    Table point holds the x coordinate of some points on x-axis in a plane, which are all integers. Writ ...

  5. React对比Vue（一些小细节的差异)

    @1===>发现一个神奇的地方在对数组进行增加删除的时候 react中一个输入框点击enter键,然后数组push,然后渲染 <input ref='valInput' onKeyUp={ ...

  6. 实验：记录一则删除GI的过程

    环境: RHEL 6.5 + Oracle GI 11.2.0.4 (2 nodes) 参考MOS文档 How to Deconfigure/Reconfigure(Rebuild OCR) or D ...

  7. Linux系统安装nodejs

    参考文档 官网连接 镜像连接 安装方法有三种: 1. 源码安装(耗时) 2. apt-get / yum 安装(版本比较低) 3. 解压后创建软连接(推荐) 方法一. 1 ) 指定目录下下载源码包 $ ...

  8. 纯HTML和CSS实现点击切换

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  9. 第四章 CSS3概述

    1.CSS3新增常用选择器(1)结构性伪类选择器:root 文档根元素 :nth-child(n) 第N个子元素"first-child 第一个元素 :kast-child 最后一个子元素 ...

  10. opcode

    https://www.cnblogs.com/JohnABC/p/4531029.html