Question

这首先看起来像一个简单的任务，包括添加空白：预包装到CCE样式表，以保留空格和换行符。目前，以下工作在Firefox中完美无缺。另一方面，在IE *中，它只是一个没有中断的文本块。

.custom_pre {
        word-wrap: break-word; /* IE */ 
        white-space: pre-wrap; /* CSS 2.1 */                            
}

当我在IE8中打开开发工具时，我发现没有冲突。当我尝试white-space: pre时，它只添加一行没有断行的文本。当我尝试添加<!DOCTYPE html>时，它没有任何区别。我尝试在DIV中包装文本但什么也没做。我尝试敲打我的屏幕，但也没有。

有人知道我为IE8工作时缺少什么吗？我迷路了。

源代码：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xmlns:mso="urn:schemas-microsoft-com:office:office" xmlns:msdt="uuid:C2F41010-65B3-11d1-A29F-00AA00C14882">

<head>
<!--[if gte mso 9]><xml>
<mso:CustomDocumentProperties>
<mso:ID_x0023_ msdt:dt="string">123</mso:ID_x0023_></mso:CustomDocumentProperties></xml><![endif]-->
<link type="text/css" href="Scripts/Custom_CSS/whiteboard_custom_12.css" rel="stylesheet" />
<SCRIPT LANGUAGE="JavaScript" SRC="Scripts/jquery/jquery-1.11.2.min.js"></SCRIPT>
<meta name="ProgId" content="SharePoint.WebPartPage.Document" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Severities</title>
<!--mstheme--><link rel="stylesheet" type="text/css" id="onetidThemeCSS" href="../../../_themes/ENSEMBLENEWLOGOTHEME/ENSE1011-65001.css"><meta name="Microsoft Theme" content="ENSEMBLENEWLOGOTHEME 1011, default">
<script type="text/javascript"> 
$( document ).ready(function() {
$(".custom_pre").each(function() {
   var $this = $(this);
   $this.html($this.text());

});  
});
</script>

<style type="text/css"> 
.style2 {
                text-align: left;
}
.style3 {
                text-decoration: none;
}
</style>

</head>

<body>

<form name="form1" method="post" action="test.aspx" id="form1">
<div>
<input type="hidden" name="MSO_PageHashCode" id="MSO_PageHashCode" value="9" />
<input type="hidden" name="__EVENTTARGET" id="__EVENTTARGET" value="" />
<input type="hidden" name="__EVENTARGUMENT" id="__EVENTARGUMENT" value="" />
<input type="hidden" name="__REQUESTDIGEST" id="__REQUESTDIGEST" value="0xC3C2C98CCA1FF9BC9AB9BC539EB6B249106AB016897D63255384C3F1046CD6F7703DD22F7F111220E078EA44ADDB16DBCAE8F40B59AFA6E15F82F59117AAD46E,10 Jun 2015 01:33:44 -0000" />
<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwUBMA9kFgICAg9kFgICAQ8PFgIeC1BhcmFtVmFsdWVzMokEAAEAAAD/////AQAAAAAAAAAMAgAAAFhNaWNyb3NvZnQuU2hhcmVQb2ludCwgVmVyc2lvbj0xMi4wLjAuMCwgQ3VsdHVyZT1uZXV0cmFsLCBQdWJsaWNLZXlUb2tlbj03MWU5YmNlMTExZTk0MjljBQEAAAA9TWljcm9zb2Z0LlNoYXJlUG9pbnQuV2ViUGFydFBhZ2VzLlBhcmFtZXRlck5hbWVWYWx1ZUhhc2h0YWJsZQEAAAAFX2NvbGwDHFN5c3RlbS5Db2xsZWN0aW9ucy5IYXNodGFibGUCAAAACQMAAAAEAwAAABxTeXN0ZW0uQ29sbGVjdGlvbnMuSGFzaHRhYmxlBwAAAApMb2FkRmFjdG9yB1ZlcnNpb24IQ29tcGFyZXIQSGFzaENvZGVQcm92aWRlcghIYXNoU2l6ZQRLZXlzBlZhbHVlcwAAAwMABQULCBxTeXN0ZW0uQ29sbGVjdGlvbnMuSUNvbXBhcmVyJFN5c3RlbS5Db2xsZWN0aW9ucy5JSGFzaENvZGVQcm92aWRlcgjsUTg/AgAAAAoKCwAAAAkEAAAACQUAAAAQBAAAAAIAAAAGBgAAAAZVc2VySUQGBwAAAAVUb2RheRAFAAAAAgAAAAYIAAAAEE1vbnRlcm8sIEVsbGlzb24GCQAAABQyMDE1LTA2LTA5VDIxOjMzOjQ0WgtkZGRzI5AVYbWSVOMPEjf44VCZqp7nuw==" />
</div>

<script type="text/javascript"> 
//<![CDATA[
var theForm = document.forms['form1'];
if (!theForm) {
    theForm = document.form1;
}
function __doPostBack(eventTarget, eventArgument) {
    if (!theForm.onsubmit || (theForm.onsubmit() != false)) {
        theForm.__EVENTTARGET.value = eventTarget;
        theForm.__EVENTARGUMENT.value = eventArgument;
        theForm.submit();
    }
}
//]]>
</script>


<script src="/WebResource.axd?d=PNpbHW9JZZojtV41Fp9GxQ2&amp;t=635186629044772859" type="text/javascript"></script>

<script> var MSOWebPartPageFormName = 'form1';</script><script type="text/javascript" language="javascript" src="/_layouts/1033/init.js?rev=SKi7C%2FTrsh1U%2FCnIwkB9Ag%3D%3D"></script>
<script type="text/javascript" language="javascript" src="/_layouts/1033/init.js?rev=SKi7C%2FTrsh1U%2FCnIwkB9Ag%3D%3D"></script><script type="text/javascript" language="javascript" src="/_layouts/1033/core.js?rev=mHKsOQ0iU3Q5jdm9OZNDdg%3D%3D"></script>
<script type="text/javascript"> 
//<![CDATA[

                function DoCallBack(filterText)
                {
                    WebForm_DoCallback('g_a652973d_3b2a_41e3_808c_f3193354b309',filterText,UpdateFilterCallback,0,CallBackError,true);
                }
                function CallBackError(result, clientsideString)
                {                
                }
            //]]>
</script>
<script type="text/JavaScript" language="JavaScript"> 
<!--
var L_Menu_BaseUrl="/sites/SERVIPCManagement/imc";
var L_Menu_LCID="1033";
var L_Menu_SiteTheme="ENSEMBLENEWLOGOTHEME";
//-->
</script><SCRIPT LANGUAGE='JavaScript' > 
<!--
//-->
</SCRIPT>
                <table style="width: 100%">
                                <tr>
                                                <td>
<table TOPLEVEL border="0" cellpadding="0" cellspacing="0" width="100%">
    <tr>
        <td valign="top"><div WebPartID="00000000-0000-0000-0000-000000000000" HasPers="true" id="WebPartg_a652973d_3b2a_41e3_808c_f3193354b309" width="100%" OnlyForMePart="true" allowDelete="false" style="" ><table border="0" align="center" xmlns:SharePoint="Microsoft.SharePoint.WebControls" xmlns:__designer="http://schemas.microsoft.com/WebParts/v2/DataView/designer" xmlns:asp="http://schemas.microsoft.com/ASPNET/20" xmlns:ddwrt2="urn:frontpage:internal"><tr><td><table border="0" cellspacing="0" width="900px"><tr><td class="style2" style="height: 226px;"><br><br><table width="900px" align="left" class="style16" border="1" cellspacing="1" cellpadding="1"><tr><td colspan="4" style="border: 1px solid #C0C0C0; padding: 10px; background-color: #CCCCCC;" align="center"><strong>SM Handoff</strong></td></tr><tr><td style="width: 183px"><strong>Client:</strong></td><td colspan="3">RSA</td></tr><tr><td style="width: 183px"><strong>Ticket:</strong></td><td>2341419</td><td width="100px"><strong>MINT</strong>:</td><td>20150609112</td></tr><tr><td style="width: 183px"><strong>Incident Description:</strong></td><td colspan="3">eBusiness Websites unavailable</td></tr><tr><td style="width: 183px"><strong>Business

                                            Impact:</strong></td><td colspan="3" class="custom_pre">Customers test test test test.
<br/>
<br/>&amp;lt;&amp;gt;()&amp;quot;&amp;#39;&amp;amp;</td></tr><tr><td style="width: 183px"><strong>What was done:</strong></td><td colspan="3" class="ms-alignleft"><div class="custom_pre">- test
<br/>
<br/>- test. 
<br/>
<br/>- Test. 
<br/>
<br/>- Test. 
<br/>
<br/>- Test. 
<br/>
<br/>*MINT* 
<br/>Testtesttesttesttest.
<br/></div></td></tr><tr><td style="width: 183px"><strong>Next steps:</strong></td><td colspan="3" class="custom_pre">Test
<br/>
<br/>NEXT MINT: June 10th at 12:00   </td></tr><tr><td style="width: 183px"><strong>Resources</strong>:</td><td colspan="3" class="custom_pre">Test: test
<br/>test: test </td></tr><tr><td style="width: 183px"><strong>Last  
                                            SM assigned:</strong></td><td colspan="3">test</td></tr></table></td></tr></table></td></tr></table></div></td>
    </tr>
</table>

                                                                                    </td>
                                </tr>
                </table>


<script type="text/javascript"> 
//<![CDATA[

WebForm_InitCallback();//]]>
</script>
</form>

</body>

</html>

Answer 1

我没有真正的ie8浏览器进行测试，但在ie11上使用ie 8仿真，并且看着Eric Meyer的this page，它看起来像white-space: pre-wrap;在IE8中运行得很好：

white-space: pre-wrap

This page似乎也表明这应该适用于IE8。

也许您网页上有其他错误（实际代码/ html / css总是有帮助）。

编辑：看到您的代码后，您的实际问题似乎就是您要替换要显示的文字部分。看起来像将部分转换为文本，然后通过jQuery返回到html会弄乱您的格式（可能会删除所有换行符）。相反，您可以尝试使用this answer或该页面上的另一个替换该部分中的违规字符。 ...或者如果来自数据库，可能只是替换服务器端。

IE8令人头疼 - 无法识别空白区域：预先包裹

1 个答案: