先,禁用 JavaScript 可以通過設置 window.disableJavascript 屬性為 true 來實現。你可以在瀏覽器的開發者工具中執行以下代碼來禁用 JavaScript:
window.disableJavascript = true;
然而,這種方法會徹底禁用網頁中的所有 JavaScript,包括復制、粘貼和其他交互功能,這顯然不是一個好的用戶體驗。
然而,這種方法會徹底禁用網頁中的所有 JavaScript,包括復制、粘貼和其他交互功能,這顯然不是一個好的用戶體驗。
相比之下,如果只想禁用頁面中某些 JavaScript 功能,可以使用以下兩種方法:
1. 禁用特定的 JavaScript 代碼塊
可以在頁面中標記出需要禁用的 JavaScript 代碼塊,并在用戶點擊禁用按鈕時動態地添加一個帶有 disabled 屬性的 script 標簽來禁用這些代碼塊。以下是一個示例:
<script>
function disableJavaScriptBlocks() {
const blocksToDisable = document.querySelectorAll('.js-disabled');
for (const block of blocksToDisable) {
const script = document.createElement('script');
script.setAttribute('disabled', 'true');
script.textContent = block.textContent;
block.parentNode.replaceChild(script, block);
}
}
</script>
<button onclick="disableJavaScriptBlocks()">禁用 JavaScript</button>
<div class="js-disabled">
這是需要禁用的 JavaScript 代碼塊。
</div>
這個示例中,我們定義了一個 disableJavaScriptBlocks 函數來禁用頁面中帶有 js-disabled 類的 JavaScript 代碼塊。當用戶點擊禁用按鈕時,這個函數會遍歷頁面中所有帶有 js-disabled 類的元素,并為每個元素動態地創建一個帶有 disabled 屬性的 script 標簽來禁用這些代碼塊。
2. 替換特定的 JavaScript 函數
如果只想禁用某個 JavaScript 函數,可以動態地替換這個函數。以下是一個示例:
<script>
function disableCopy() {
const originalCopy = document.execCommand;
document.execCommand = function(command) {
if (command === 'copy') {
console.log('禁止復制!');
return false;
}
return originalCopy.apply(this, arguments);
};
}
</script>
<button onclick="disableCopy()">禁用復制</button>
這個示例中,我們定義了一個 disableCopy 函數來禁用頁面中的復制功能。當用戶點擊禁用按鈕時,這個函數會動態地替換 document.execCommand 函數,如果用戶嘗試執行 copy 命令,它會輸出一條提示信息并返回 false,從而阻止復制操作。
覽網頁時,當從A頁面點擊跳轉到B頁面后,一般情況下,可以點擊瀏覽器上的“后退”按鈕返回A頁面。
如果進入B頁面后,B頁面想讓訪問者留下,禁止返回,是否可以實現呢?
這簡直是要控制瀏覽器的行為,雖然有些邪惡,但確實可以實現,使用特殊的JavaScript代碼就可實現。
方法如下:
監聽瀏覽器的popstate事件,該事件會在用戶點擊瀏覽器的回退按鈕時被觸發。
然后,使用History.pushState()方法向當前瀏覽器會話的歷史堆棧中添加一個陷阱狀態,該狀態會使“回退”操作無效。
<script>
//瀏覽器返回鍵事件
pushHistory();
window.addEventListener("popstate", function(e) {
//判斷移動端
var userAgentInfo = navigator.userAgent;
var Agents = new Array("Android", "iPhone", "SymbianOS", "Windows Phone", "iPad", "iPod");
var equipmentType = false;
for (var v = 0; v < Agents.length; v++) {
if (userAgentInfo.indexOf(Agents[v]) != -1) {
equipmentType = true;
break;
}
}
if (equipmentType) {
$("#mask-back").show();
$("#mask-back .back-close").on("click", function() {
$("#mask-back").hide();
})
}
pushHistory(); //注,此處調用,可以讓用戶一直停留著這個頁面
}, false);
function pushHistory() {
var stateeee = {
title: "title",
url: "#"
};
window.history.pushState(stateeee, "title", "#");
}
</script>
建立兩個文件:a.html、b.html。
a文件內容簡單寫一句代碼:
<a href="b.html">goto b.html</a>。
b文件內容寫入上面的源碼。
打開a頁面,點擊鏈接進入b頁面,這時再點擊瀏覽器上的“后退”按鈕,會發現:操作無效,無法后退。
這個黑暗的技巧,雖然使用了不常見的技術方法,但查看頁面源碼很容易發現其實現原理。
為了保護代碼、防止代碼被分析,可以對上面的JavaScript代碼加密,加密使用JShaman。
進入JShaman官網,貼入代碼:
在配置中,勾選“字符串加密”:
然后生成混淆加密的JavaScript代碼:
復制粘貼回b文件:
這時,代碼成為加密狀態,雖然不影響運行,是萬萬不可能了。
avascript:禁止按鈕,3種方法實現短信驗證倒計時
表單中經常會用到手機短信驗證或者郵箱驗證,點擊按鈕發送驗證碼后會倒計時,然后按鈕會成灰色不可點擊狀態,或者點擊無效。這可以預防不法分子或者機器刷驗證碼,下面講一下使用禁止按鈕實現短信驗證倒計時,你知道有幾種方法呢?
禁止按鈕短信驗證
首先來了解一下禁止按鈕的實現和原理:
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset="utf-8">
<script type="text/javascript">
window.onload = function ()
{
var oBtn = document.getElementById('btn');
//禁止按鈕
oBtn.disabled = false;
oBtn.onclick = function ()
{
oBtn.disabled = true;
alert(oBtn.value);
}
}
</script>
</head>
<body>
<input type="button" id="btn" value="點我試試">
</body>
</html>
短信驗證
1、第一種方法
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset="utf-8">
<script type="text/javascript">
window.onload = function ()
{
var oBtn = document.getElementById('btn');
var timer = null;
var n = 5;
oBtn.onclick = function ()
{
oBtn.disabled = true;
timer = setInterval(function(){
n--;
oBtn.value = n + '秒之后重新發送';
if (n == 0) {
clearInterval(timer);
oBtn.value = '5秒之后重新發送';
oBtn.disabled = false;
n = 5;
}
}, 1000);
}
}
</script>
</head>
<body>
<input type="button" value="5秒之后重新發送" id="btn">
</body>
</html>
短線驗證按鈕倒計時方法
2、第二中方法
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset="utf-8">
<script type="text/javascript">
window.onload = function ()
{
var oBtn = document.getElementById('btn');
var timer = null;
var n = 5;
oBtn.onclick = function ()
{
this.disabled = true;
var _this = this;
// alert(_this);
timer = setInterval(function(){
// alert(_this);
n--;
_this.value = n + '秒之后重新發送';
if (n == 0) {
clearInterval(timer);
_this.value = '5秒之后重新發送';
_this.disabled = false;
n = 5;
}
}, 1000);
}
}
</script>
</head>
<body>
<input type="button" value="5秒之后重新發送" id="btn">
</body>
</html>
短信驗證倒計時
3、第三種方法
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset="utf-8">
<script type="text/javascript">
window.onload = function ()
{
var oBtn = document.getElementById('btn');
var timer = null;
var n = 5;
var flag = false;
oBtn.onclick = function ()
{
if (flag) {
return;
}
flag = true;
var _this = this;
// alert(_this);
timer = setInterval(function(){
// alert(_this);
n--;
_this.value = n + '秒之后重新發送';
if (n == 0) {
clearInterval(timer);
_this.value = '5秒之后重新發送';
flag = false;
n = 5;
}
}, 1000);
}
}
</script>
</head>
<body>
<input type="button" value="5秒之后重新發送" id="btn">
</body>
</html>
請關注鍵盤碼農,把你想知道的問題在下面留言評論,更新你想要的答案,專為你解答!
*請認真填寫需求信息,我們會在24小時內與您取得聯系。