Question

由于某种原因，我的功能未在IE中触发。它可以在Safari，Firefox，Chrome，Opera和Edge的所有其他软件上运行。谁能看到与此相关的特定问题？我认为我已将其范围缩小到此特定功能。所有其他js似乎都正常工作。谢谢！

使用Windows Server 2012 R2

这是有问题的功能

function mySearch() {
  var input = document.getElementById("Search");
  var filter = input.value.toLowerCase();
  var nodes = document.getElementsByClassName('connect-cat');


  for (i = 0; i < nodes.length; i++) {

  if (nodes[i].innerHTML.toLowerCase().includes(filter)) {
      nodes[i].style.display = "block";
    } else {
      nodes[i].style.display = "none";
    }
  }
}

页面中使用了一些HTML，可能不一定要诊断此问题，而是要尽我所能。

搜索栏：

<div style="width:100%;margin-left:320px;">
      <input type="text" id="Search" onkeyup="javascript:searching();" Placeholder="Please enter a search term...">&nbsp;</input>
      <input id="lawsonbox" type="checkbox" onchange="javascript:storefront();" style="position:absolute;width:15px;" ><font size="-3" style="margin-left:22px;">Highlight customizable Storefront products</font></input>
  </div>
<br/><br/>

几个可搜索的产品，html：

<div class="connect-cat" style="width:237px;height:350px;position:inherit;float:left;visibility: visible; display: block;">
<a href="CreateUserDocument.aspx?code=ADBUILDER8">
<img style="width:217px;" src="Custom/Themes/standard/Inserts/images/Ad_Print_Thumb.jpg"/>
<br/>
<div id="ptitle">
Ad - Print
<br/>
Customize on Storefront
</div>
<div id="pdesc">
Bring awareness and education
<br/>
to your audience.
</div>
</a>
<div style="display:none;">"print ad"ad print"experience more"experience more campaign"first choice campaign"home health collection"assisted living collection" post-acute rehabilitation services collection"ad"</div>
</div>

<div class="connect-cat" style="width:237px;height:350px;position:inherit;float:left;visibility: visible; display: block;">
<a href="Custom/Themes/standard/Inserts/Forms/1_1_15_Radio_TV sheet.xls">
<img class="sfclass" style="width:217px;" src="Custom/Themes/standard/Inserts/images/Ad_Radio_Thumb.jpg"/>
<br/>
<div id="ptitle">
Ad - Radio
<br/>
Download
</div>
<div id="pdesc">
Work with local station to produce.
<br/>
Must use Society-approved music bed.
</div>
</a>
<div style="display:none;">"radio ad"ad radio"experience more"experience more campaign"first choice campaign"ad"lawson"</div>
</div>

Answer 1

首先，修改函数名称，确保您正在使用已定义的函数。

第二，参考this article，我们知道include（）方法不支持IE浏览器，因此，请尝试使用indexof method来检查innerhtml是否包含过滤器值。

尝试如下修改您的代码：

<head>
    <meta charset="utf-8" />
    <title></title>
    <script type="text/javascript">
        function searching() {
            var input = document.getElementById("Search");
            var filter = input.value.toLowerCase();
            var nodes = document.getElementsByClassName('connect-cat');


            for (i = 0; i < nodes.length; i++) {

                if (nodes[i].innerHTML.toLowerCase().indexOf(filter) !== -1) {
                    nodes[i].style.display = "block";
                } else {
                    nodes[i].style.display = "none";
                }
            }
        }
        function storefront() {

        }
    </script>
</head>
<body>
    <div style="width:100%;margin-left:320px;">
        <input type="text" id="Search" onkeyup="javascript:searching();" Placeholder="Please enter a search term...">&nbsp;</input>
        <input id="lawsonbox" type="checkbox" onchange="javascript:storefront();" style="position:absolute;width:15px;"><font size="-3" style="margin-left:22px;">Highlight customizable Storefront products</font></input>
    </div>
    <br /><br />
    <div class="connect-cat" style="width:237px;height:350px;position:inherit;float:left;visibility: visible; display: block;">
        <a href="CreateUserDocument.aspx?code=ADBUILDER8">
            <img style="width:217px;" src="Custom/Themes/standard/Inserts/images/Ad_Print_Thumb.jpg" />
            <br />
            <div id="ptitle">
                Ad - Print
                <br />
                Customize on Storefront
            </div>
            <div id="pdesc">
                Bring awareness and education
                <br />
                to your audience.
            </div>
        </a>
        <div style="display:none;">"print ad"ad print"experience more"experience more campaign"first choice campaign"home health collection"assisted living collection" post-acute rehabilitation services collection"ad"</div>
    </div>

    <div class="connect-cat" style="width:237px;height:350px;position:inherit;float:left;visibility: visible; display: block;">
        <a href="Custom/Themes/standard/Inserts/Forms/1_1_15_Radio_TV sheet.xls">
            <img class="sfclass" style="width:217px;" src="Custom/Themes/standard/Inserts/images/Ad_Radio_Thumb.jpg" />
            <br />
            <div id="ptitle">
                Ad - Radio
                <br />
                Download
            </div>
            <div id="pdesc">
                Work with local station to produce.
                <br />
                Must use Society-approved music bed.
            </div>
        </a>
        <div style="display:none;">"radio ad"ad radio"experience more"experience more campaign"first choice campaign"ad"lawson"</div>
    </div>
</body>

javascript无法在IE中触发

1 个答案: