jquery - 样式在 IE8 中不适用，但在 Chrome 和 Firefox 中适用

Question

我在网站中有以下 html。 “ApplicationName_ButtonDiv”、“ApplicationName_Button”等中指定的样式在 Chrome 和 Firefox 中正确应用，但在 IE8 中则不然。

<div class="CommandButtonContainer">
   <div class="ApplicationName_ButtonDiv">
      <button id="changeName" type="button" class="ApplicationName_Button"onclick = "javascript: window.location='/Application/Customer/EditName';" >
         <a href="#" class="ApplicationName_Button">
            <span>
               <span>Change Name</span>
            </span>
         </a>
      </button>
   </div>
</div>

1)仅在IE8下页面出现错误:

Webpage error details

User Agent: Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 5.1; Trident/4.0; chromeframe/18.0.1025.162; InfoPath.1; .NET CLR 3.0.04506.648; .NET CLR 3.5.21022; .NET CLR 1.1.4322; .NET CLR 2.0.50727; .NET CLR 3.0.4506.2152; .NET CLR 3.5.30729; .NET4.0C; .NET4.0E) Timestamp: Sun, 11 Aug 2013 10:06:22 UTC

Message: Permission denied Line: 5514 Char: 3 Code: 0 URI: NAME OF SITE REMOVED/publishmode.x.x.x.js

这似乎与:

5513  contents: function( elem ) {
5514      return jQuery.nodeName( elem, "iframe" ) ?
5515          elem.contentDocument || elem.contentWindow.document :
5516          jQuery.makeArray( elem.childNodes );
5517  }

2) 当您在 IE Developer Tools 中查看 html 时，它看起来略有不同，但重要的是，与您查看源代码时不同:

<div class="CommandButtonContainer">
   <div class="ApplicationName_ButtonDiv">
      <button class="ApplicationName_Button" id="changeName" onclick="javascript: window.location='/Application/Customer/EditName';" type="button">
         <a class="ApplicationName_Button" href="#"/>
         <span>
            <span>
           Text - Change Name
            Text - Empty Text Node (italics)
         </a/>
      Text - Empty Text Node (italics)

anchor 标记已关闭，span 标记现在未包含在其中。样式依赖于内部有两个跨度的 anchor 。这可能只是该工具的一个怪癖，因为我才刚刚开始使用它。

如果您对导致此问题的原因有任何想法，请告诉我。谢谢约翰

Answer 1

把你的按钮变成a标签:

你有:

<button id="changeName" type="button" class="ApplicationName_Button"onclick = "javascript: window.location='/Application/Customer/EditName';" >
         <a href="#" class="ApplicationName_Button">
            <span>
               <span>Change Name</span>
            </span>
         </a>
      </button>

试着让它成为:

<a id="changeName" class="ApplicationName_Button" type="button" onclick="javascript: window.location='/Application/Customer/EditName';">Change Name</a>

看看这是否适合您...仅按照您的方式单独使用该部分并没有真正意义。此外，您在一个跨度内有一个跨度...为什么？