JavaScript 常用代码段（四）

这是我参与11月更文挑战的第9天，活动详情查看：2021最后一次更文挑战

1. 解决点击空链接返回页面顶部的问题

有时候一些空链接被点击是会让网页返回到顶部，导致这些问题的原因，一般是加了一些特殊的链接，如 “#” 等；

window.onload = function() {
    var as = document.getElementsByTagName("a"),
         i = 0,
         l = as.length,
         h = "";
    while (i < l) {                        // 遍历所有 a 链接
        h = as[i].getAttribute("href");
        if (h == "#" || !h) as[i].href = "JavaScript:void(0)";  // 修改 a 链接
        i++;
    }
};

• 对 “#” 和空链接过滤；
• JavaScript:void(0)，void 是一个操作符；

2. 解决 URL 传递中文参数出现乱码

不同的浏览器处理编码的方式不同。如：Chrome、IE 大多是 UTF-8 编码，FireFox 可能是 ISO-8859-1 编码。

一般将传递的参数利用 encodeURIComponent 进行 urf-8 格式的 url 编码，服务端可以再解码，就可以解决中文乱码问题了。

window.onload = function() {
    var cencodeStr = encodeURIComponent("我是 Qingjs");
    alert("调用 encodeURICompoent 对 ‘我是Qingjs’ 编码：" + cencodeStr + "\n" + "调用 decodeURIComponent 对解码后：" + decodeURIComponent(cencodeStr));
}

• 可以使用 encodeURI 编码，在服务端用 decodeURI 解码；也可以使用 encodeURIComponent 对字符串进行 URI 组件编码，对应的解码函数为 decodeURIComponent

3. 获取地址栏 URL 的参数

JavaScript 提供的 window.location.href 可以获取地址栏 URL 的全部信息

window.onload = function() {
    function getURLArgs(e) {
        var args = "空",                              // 获取地址栏 URL 的参数
            _args = [];                               // 试着在浏览器中添加参数
        u = window.location.href,
        s = u.indexof("?"),
        i = 0,
        j = 0,
        o = null;

        if (s != -1) {
            args = u.substr(s+1).split("&");
        }
        e.innerHTML = "参数以逗号分隔：" + args
        l = args.length;
        for(; i < l; i++) {
            if (args[i]) {
                o = args[i].split("=");
                _args[o[0]] = o[1];
            }
        }

        console.log(_args)
        return _args;
    }
}

• 先计算 “？” 的位置，然后截取从 “？” 起始的所有字符，不包括 “？”；

4. 屏蔽功能键 Shift、Alt、Ctrl

浏览器的功能键与其他键组合会产生很多特殊组合效果，如复制、粘贴等

window.onload = function() {
    var shieldingFunctionKeys = (function() {
        document.onkeydown = function(event) {
            event = event || _W.event;
            if (event.shiftKey || event.altKey || event.ctrlKey) {
                alert("禁止按 Shift 键、Alt 键、Ctrl 键！")
            }
        };
    })();
};

• Shift 键：event.shiftKey、Alt 键：event.altKey、Ctrl 键： event.ctrlKey