品一品编程 --- 1

作者: Candy程 | 来源:发表于2017-04-12 14:08 被阅读0次
问题描述:

淘宝首页需要实现这样一个功能,对于页面上非taobao.com域名下的链接,在用户点击时,需要在链接处弹出提示框,提示用户此链接非淘宝域名下的链接,并给与用户选择是否继续访问。如果用户确认继续访问,则在新窗口打开链接。请写出相应的代码。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>品一品编程-1</title>
</head>
<body>
    <a href="https://www.taobao.com">https://www.taobao.com<br/></a>
    <a href="https://www.taobao.com/?spm=a218k.m3dyt3534.1581860521.1.6jNnlE">https://www.taobao.com/?spm=a218k.m3dyt3534.1581860521.1.6jNnlE<br/></a>
    <a href="https://www.tmall.com">https://www.tmall.com<br/></a>
    <script>
        /*补充完整程序*/
    </script>
</body>
</html>

程序如下:

<script>
        /*补充完整程序*/
        (function() {
            var obj = document.body
            var reg = new RegExp('https://www.taobao.com')
            obj.onclick = function(ev) { //事件委托
                var ev = ev || window.ev //兼容ie
                var target = ev.target || ev.srcElement
                if(target.nodeName.toLowerCase() === 'a') {
                    var href = target.href
                    if(reg.test(href)) {
                        return
                    }
                    else {
                        ev.preventDefault() //阻止a标签的默认跳转
                        if(window.confirm(href + ':非淘宝域名下的链接,是否继续访问?')) {
                            location.href = href
                        }
                        else {

                        }
                    }
                }
            }
        })()
    </script>

执行效果如下:
![0C@3XVL7~M_54O]}D`R]VMD.png](https://img.haomeiwen.com/i5319840/076ae99416dbe43a.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)

相关文章

  • 品一品编程 --- 1

    问题描述: 淘宝首页需要实现这样一个功能,对于页面上非taobao.com域名下的链接,在用户点击时,需要在链接处...

  • 品一品编程 --- 2

    问题描述: 实现目前一些主流框架的循环渲染 程序如下:

  • 品一品编程 --- 4

    问题描述: 随机生成一个[min,max]区间内的整数 程序如下: 问题描述: 有一个长度为100的数组,以优雅的...

  • 品一品编程 --- 3

    问题描述: 实现链式调用 程序如下:

  • 品一品编程 --- 5

    问题描述: 实现基于数组的 sort 排序函数 程序如下: //冒泡排序 O(n^2) //快速排序---优势:...

  • 南熙妃位

    皇后 正一品:皇贵妃1 从一品:贵妃2 正二品:淑贤德惠妃 各1位 从二品:(九嫔)各1位 正三品...

  • 品一品编程 --- 6(函数式编程)

    问题描述 给出数组如:[['a','b','c'],['d','e'],['f','g']…..]输出:['adf...

  • 品茶如品人生

    茶品与人品。品茶如品人生。 品茶有三品: 一品一一品火功 二品一一品滋味 三品一一品茶韵 品火功,是感受茶叶的加工...

  • 品茶如品人生

    茶品与人品。品茶如品人生。 品茶有三品: 一品一一品火功 二品一一品滋味 三品一一品茶韵 品火功,是感受茶叶的加工...

  • 芋头 芋头

    (1) “湘聚会”小聚,菜中有一品—...

网友评论

    本文标题:品一品编程 --- 1

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