Question

我正在使用一种功能，我发现谷歌搜索禁用DIV中的所有链接。

它工作正常，我完全理解它在做什么。就是这样：

function disableLinksByElement(el) {
  if (document.getElementById && document.getElementsByTagName) {
    if (typeof(el) == 'string') {
      el = document.getElementById(el);
    }
    var anchors = el.getElementsByTagName('a');
    for (var i=0, end=anchors.length; i<end; i++) {
      anchors[i].onclick = function() {
        return false;
      };
    }
  }
}

不幸的是，为了使这些链接能够再次启用，它还不足以设置所有＆＃34; onclick＆＃34;返回true，因为 - 这是我的猜测 - 我的大多数链接都是调用JS函数，而且它们不是简单的www链接。

总结一下，这就是我要做的事情：我正在使用Ajax调用，完成后，使用一些更新的HTML代码填充特定的DIV。同时，我将DIV调暗到50％（不透明度，IE8 +安全）并禁用链接。当Ajax调用返回时，它们取消DIV并且（尝试，没有成功）重新启用链接。请注意，Ajax调用真正产生了新的＆＃34; DIV中的HTML代码，因此这些链接应该是全新的 - 而不是阻止，但它们是......

SAMPLE OF LINKS THAT GET DISABLED BUT NOT RE-ENABLED IN THE DIV
THESE ARE PHP-GENERATED FROM SCRATCH EACH TIME

<a class="btn" onclick="someJSfunction(2,1,50041); return false;">Do something</a>

<a href="#" onclick="someOtherJSFunction(1); return false;">
<img src="imguser/thumb_4596543689.jpg" width="25px" height="25px">
</a>

免责声明：我完全清楚使用jQuery会更容易，而且我完全清楚使用客户端调试器，任何用户仍然可以调用＆＃34;执行函数时的那些链接。所有的安全检查都在服务器端完成，所以不用担心。这只是为了阻止不耐烦的用户。

Answer 1

在更改超链接“onclick”的处理函数之前，请先修改旧函数，这样就可以简单地恢复它。

这样的事情：

＆＃13;

function Test1() {
  alert('test 1');
}

function Test2() {
  alert('test 2');
}

function disableLinksByElement() {
  var hyp = document.getElementsByTagName('a');
  for (var i = 0; i < hyp.length; i++) {
    hyp[i].Oldonclick = hyp[i].onclick;
    hyp[i].onclick = function() {
      return false;
    }
  }

}

function enableLinksByElement() {
  var hyp = document.getElementsByTagName('a');
  for (var i = 0; i < hyp.length; i++) {
    hyp[i].onclick = hyp[i].Oldonclick;

  }

}

＆＃13;

<a onclick="Test1(); ">Test 1</a>
<br />
<a onclick="Test2(); ">Test 1</a>
<br />
<button onclick="disableLinksByElement()">disable</button>
<br />
<button onclick="enableLinksByElement()">enable</button>

＆＃13;

Answer 2

最后，这是我发现的最佳解决方案：

function disableLinksByElement(el) {
  document.getElementById(el).style.pointerEvents = "none";
  document.getElementById(el).style.opacity = 0.2;
}

function enableLinksByElement(el) {
  document.getElementById(el).style.opacity = 1;
  document.getElementById(el).style.pointerEvents = "auto";
}

不透明度，当然，它只是告诉我发生了什么。从这里开始：

http://caniuse.com/#search=pointerevents

我可以看到唯一的“主要”问题可能是，如果你使用IE，你至少需要IE11才能看到它正常工作，但我的回答只是“开始使用真正的浏览器”......

如何在禁用HTML后重新启用HTML链接？

2 个答案: