1

我在网站中有以下 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的页面有错误：

网页错误详情

用户代理：Mozilla/4.0（兼容；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) 时间戳：2013 年 8 月 11 日星期日 10:06:22 UTC

消息：权限被拒绝行：5514 字符：3 代码：0 URI：站点名称已删除/publishmode.xxxjs

这似乎与：

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

2) 当您在 IE 开发人员工具中查看 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)

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

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

4

2 回答 2

1

如果 IE 的开发工具显示的布局与您的预期不同，那么通常表明您的代码中存在导致 IE 解析器阻塞的 HTML 错误。所以首先要做的是检查：转到W3C 的 HTML Validator并修复它报告的任何错误。

这也可能是缺少样式的原因；如果没有看到它的实际效果很难确定，但如果你幸运的话，那也可以解决这个问题。如果没有，那么您需要向我们展示相关的 CSS 以获得更多帮助。（编辑问题以包含它）。

CSS 很可能是相关的，特别是对于<button>标签，因为按钮的默认样式在跨浏览器之间并不完全一致，尤其是像 IE8 这样的旧浏览器。您可能需要考虑使用 CSS“重置”样式表来规范一些浏览器的差异，例如。

你提到了一个 Javascriptpermission denied错误。我认为这与您的按钮样式不正确无关（尽管老实说，鉴于您提供的代码数量有限，这是不可能的），但这显然仍然是一个问题，并且会破坏某些东西您的网站，即使不是那样。

权限问题是您的 JS 代码试图访问元素的内容iframe。如果您遇到权限错误，则意味着浏览器认为 iframe 内的页面与您的主站点的域不同，因此出于安全原因它不会让您的代码修改它。

我不知道这个 iframe 在您的网站上是什么，但无论它是什么，似乎在其中工作的任何代码都不起作用。

IE8 的安全模型在这方面还算不错，但也有一些怪癖。一个特别吸引了很多人的地方，那就是一个空页面——即默认为 URL——about:blank可以被认为来自不同的域。在这种情况下，这显然无关紧要，但浏览器不够聪明，无法知道这一点。如果这是您的问题，您可以通过让代码从您的站点加载一个虚拟页面而不是使用about:blank默认页面来解决它。

还有其他可能发生的怪癖，但从我从问题中得到的细节来看，这似乎是最有可能的。

希望有帮助。

于 2013-08-11T13:17:00.163 回答
1

将你的按钮变成一个标签：

你有：

<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>

看看这是否适合你......只是你拥有的那部分并没有真正的意义。另外，你有一个跨度内的跨度......为什么？

于 2013-08-11T11:59:40.300 回答