Question

基本上我有这个脚本，您可以使用按钮切换以显示或隐藏元素，如果您单击任何不是按钮或目标元素的位置

然后它隐藏了那个目标元素，所以我也喜欢它，所以它适用于所有浏览器，除了在Internet Explorer上。我目前正在Internet Explorer 11上测试它，它一直给我这个错误

对象不支持属性或方法'匹配'

它引用了这行代码

if（！event.target.matches（'＃dropbtn'））{

那么我怎样才能让这个在Internet Explorer上运行任何代码示例都会受到赞赏，因为我学习的方式最好，而且我在google上找不到任何关于这个问题的东西。

这是我的代码

.dropbtn {
  background-color: lime;
}

.dropdown-content {
  display: none;
}

.show {
  display: block;
}

<meta name="viewport" content="width=device-width">

<button id="dropbtn" onclick="myFunction()">Dropdown</button>

<div class="dropdown-content" style="background:red; height: 300px;"></div>

未来读者的更新

请查看 Barmars 回答以及我在下面的回答，了解如何让它成功运作。

Answer 1

感谢 Barmar 和其他人给了我一些提示，希望他们只是做了我的脚本的完整代码示例，而不是暗示我能够理解它，感谢大家。

我刚发布了 我对解决方案的回答 。但我会给Barmar投票，以便未来的读者看看他的回答和 这个代码示例 回答，知道如何成功地做到这一点。

<meta name="viewport" content="width=device-width">

<style>


.dropbtn{
    background-color: lime;
}



.dropdown-content {
    display: none;
}



.show {display:block;}

</style>

<button id="dropbtn" onclick="myFunction()">Dropdown</button>

  <div class="dropdown-content" style="background:red; height: 300px;"></div>
  
  <script>

 
/* When the user clicks on the button, 
toggle between hiding and showing the dropdown content */
function myFunction() {
    document.getElementsByClassName("dropdown-content")[0].classList.toggle("show");
}

// Prevent event bubble up to window.
document.getElementsByClassName("dropdown-content")[0].addEventListener('click', function (event) {
  event.stopPropagation();
});

// Close the dropdown if the user clicks outside of it
window.onclick = function(event) {
	
/*This section of code makes this compatible with internet explorer 
and non-internet explorer browsers->*/if (!event.target.matches) {
    event.target.matches = event.target.msMatchesSelector;
}
	
  if (!event.target.matches('#dropbtn')) {

    var dropdowns = document.getElementsByClassName("dropdown-content");
    var i;
    for (i = 0; i < dropdowns.length; i++) {
      var openDropdown = dropdowns[i];
      if (openDropdown.classList.contains('show')) {
        openDropdown.classList.remove('show');
      }
    }
  }
}

</script>

Answer 2

匹配功能不是默认dom规范的一部分。在IE9及更高版本中，它可用作msMatchesSelector（）。

Answer 3

IE9没有var mySearch = search.load({ id: '851' }); var defaultFilters = mySearch.filters; var customFilters = {}; customFilters = {"name":"custrecord_customer","operator":"anyof","values":["64468"],"isor":false,"isnot":false,"leftparens":0,"rightparens":0}; defaultFilters.push(customFilters); mySearch.filters = defaultFilters;方法，它称之为matches。使用MDN中的此polyfill自动切换到它。

msMatchesSelector

此切换脚本适用于除Internet Explorer之外的所有浏览器，如何解决此问题？

3 个答案: