美文网首页网页前端后台技巧(CSS+HTML)互联网科技码农的世界
前端学习代码实例-JavaScript 阻止击超链接的跳转

前端学习代码实例-JavaScript 阻止击超链接的跳转

作者: 560b7bb7b879 | 来源:发表于2019-04-29 17:30 被阅读2次

    点击链接具有跳转效果,但是有时我们不需要这种效果。

    下面就通过代码实例介绍一下如何实现此效果。

    代码如下:

    <!DOCTYPE html>
    <html>
    <head>
    <meta charset=" utf-8">
    <meta name="author" content="http://www.softwhy.com/" />
    <title>web前端开发学习扣qun:731771211   详细教程分享</title>
    <style type="text/css">
    div{
      width:150px;
      height:50px;
      margin:0px auto;
      margin-top:800px
    }
    </style>
    </head>
    <body>
    <div><a href="#">学习前端,我们是认真的</a></div>
    </body>
    </html>
    
    

    以上代码虽然将链接地址设置为#,但是点击之后依然有跳转效果,网页返回顶端。

    代码修改如下:

    <!DOCTYPE html>
    <html>
    <head>
    <meta charset=" utf-8">
    <meta name="author" content="http://www.softwhy.com/" />
    <title>学习前端,我们是认真的</title>
    <style type="text/css">
    div{
      width:150px;
      height:50px;
      margin:0px auto;
      margin-top:800px
    }
    </style>
    </head>
    <body>
    <div><a href="#">学习前端,我们是认真的</a></div>
    </body>
    </html>
    
    

    更多编程知识分享,关注v-x公众号id:mtbcxx

    相关文章

      网友评论

        本文标题:前端学习代码实例-JavaScript 阻止击超链接的跳转

        本文链接:https://www.haomeiwen.com/subject/zqfunqtx.html