Question

单击NewUrl时，我试图在LaunchPopup函数中访问chat online变量。

在单击事件之后，我的Chrome调试器可以在关闭状态中看到变量。我也尝试将变量绑定到此变量，但变量仍为undefined。

[].forEach.call(document.querySelectorAll(‘.link '), function (doc) {

     doc.addEventListener('click', function() {
      var uniqueID = 'unique data';
      var NewUrl = Url.split("&response_type")[0] + encodeURIComponent("&uniqueID=" + uniqueID);
     });
     
     if (doc != null) {
      window.LaunchPopup = function() {
       var self = this;
       n = window.open(self.NewUrl, '_blank', 'width=450,height=600,scrollbars=yes,resizable=yes');
       return openPopup = n == null ? true : false;
      };
      
      doc.innerHTML = '<a href="' + Url + '" class="btn btn-default" target="_blank" onclick="return LaunchPopup();">Chat online</a>';
     }
    });

感谢帮助和一些解释者为什么无法访问该变量。

Answer 1

解决此问题的一种方法是通过将if语句拆分为自己的函数来对其进行一些重构。然后，将doc和NewUrl传递到函数中。

您还需要将window.LaunchPopup移出，以扩大范围，并使对它的调用传入this。

最后，我将newURL放在了data-属性中，以便当点击锚标记时我们可以通过this访问它

这里是一个例子。

[].forEach.call(document.querySelectorAll('.link '), function(doc) {

  doc.addEventListener('click', function() {
    var uniqueID = 'unique data';
    var newUrl = Url.split("&response_type")[0] + encodeURIComponent("&uniqueID=" + uniqueID);
    showPop(doc, NewUrl);
  });
});

function showPop(doc, theURL) {
  if (doc != null) {
    doc.innerHTML = '<a href="' + theURLUrl + '" data-new-url="' + newURL + '" class="btn btn-default" target="_blank" onclick="return LaunchPopup(this);">Chat online</a>';
  }
}

window.LaunchPopup = function(anchor) {
  var newUrl = anchor.getAttribute("data-new-url");
  var self = this;
  var n = window.open(newUrl, '_blank', 'width=450,height=600,scrollbars=yes,resizable=yes');
  return openPopup = n == null ? true : false;
};

Answer 2

您可以直接在foreach回调中直接声明newurl变量，这样两个事件侦听器都可以访问它。

[].forEach.call(document.querySelectorAll(‘.link '), function (doc) {

     var NewUrl;

     doc.addEventListener('click', function() {
      var uniqueID = 'unique data';
      NewUrl = Url.split("&response_type")[0] + encodeURIComponent("&uniqueID=" + uniqueID);
     });
     
     if (doc != null) {
      window.LaunchPopup = function() {
       var self = this;
       n = window.open(NewUrl, '_blank', 'width=450,height=600,scrollbars=yes,resizable=yes');
       return openPopup = n == null ? true : false;
      };
      
      doc.innerHTML = '<a href="' + Url + '" class="btn btn-default" target="_blank" onclick="return LaunchPopup();">Chat online</a>';
     }
    });

Answer 3

必须对实现进行更改，而且效果很好。

[].forEach.call(document.querySelectorAll(‘.link '), function (doc) {

     doc.addEventListener('click', function() {
      var uniqueID = 'unique data';
      var NewUrl = Url.split("&response_type")[0] + encodeURIComponent("&uniqueID=" + uniqueID);
      var n = window.open(NewUrl, '_blank', 'width=450,height=600,scrollbars=yes,resizable=yes');
      if(n == null) {
          return true;
      }
      e.preventDefault();
      return false;
     });
     
     if (doc != null) {
           
      doc.innerHTML = '<a href="' + Url + '" class="btn btn-default" target="_blank" ">Chat online</a>';
     }
    });

如何在点击事件或上下文外部访问变量

3 个答案: