a标签阻止默认跳转行为事件

a标签有默认的点击事件,点击事件的默认行为是跳转到href指定的某一个网址

组织默认跳转事件行为

  1.javascript:void(0)  空处理    void为关键字

<!-- void 它只进行计算或者运行,但是没有返回值 -->
    <a href="javascript:void(0)">点击跳转</a>    <!--当点击跳转的时候,就会告诉a标签,当前的解析是用js来解析的-->
    <br><br>
    <a href="Javascript:void(alert('不跳转'))">警告警告</a>     <!--不跳转 但是会弹出一个提示框-->

  2.javascript:;

 <a href="javascript:;"></a>   <!-- 既不跳转,也没提示 -->

  3.使用手动的方式给a标签一个点击事件来阻止跳转,然后再点击事件中添加return false这个属性

    <a href="return false" onclick="return false">点击跳转</a>

  4.e.preventdefaule()  相当于button中要提交的submit,不让它提交给这个属性就可以阻止它的提交

<a href="http://wwww.baidu.com" id="test">跳转</a>



var test = document.getElementById("test");
            function Default(e){
                // 注意这里的循环语句是没有大括号的,因为他不会报错,而且有了大括号是无法阻止跳转的
                if (e && e.preventDefault) 
                e.preventDefault();
                 else
                   window.event.returnValue = false;
            }
                test.onclick = function(e){
                    Default(e)
                
            }

注意点:如果href属性是锚点,它是不管在哪里只要点击了跳转就会跳转到菜单栏或者顶部

原文地址:https://www.cnblogs.com/zycs/p/13275617.html