目标：想在iframe里显示纯文本，与textarea里的一模一样（第三次）

<textarea id="text" rows="12" cols="36" onkeydown="getText()" style="width:200;height:200;font-family: Tahoma; font-size: 9pt" name="vv">
sdfsdfsdfsdfsdfm,,,,,,,,,,,,,,,g,,,,,,,,,,,,,g,,,,,,,,,,,,,,,,,,,,g,,,,,,,,,,,,,g,,,,,,,,,,,u</textarea>
<script>
/////////////////////////////51windows/////////////////////////////
oTable=document.createElement("<table width=200 height=200 style='table-layout:fixed;border:solid 1px red;word-break:break-all;'></table>")
oTbody = document.createElement("tbody");
oTr = document.createElement("tr");
oTd = document.createElement("td");
oTable.appendChild(oTbody);
oTbody.appendChild(oTr);
oTr.appendChild(oTd);
oTd.vAlign = "top";
oTd.style.fontFamily = text.style.fontFamily;
oTd.style.fontSize = text.style.fontSize;
oTd.innerText = text.value;
document.body.appendChild(oTable);
function getText()
{
oTd.innerText = text.value;
}
</script>不是很完美 不过基本达到要求

解决方案 »

  1.   

    感谢yeefly(Web开发版)没有这样复杂的，上面的代码已经实现了要求的1,2,3,4只是这个问题没有解决：当有一串标点时不能自动换行，出现了横向滚动条我不需要在iframe或textarea里编辑文本
      

  2.   

    <textarea id=text style='width:100%;height:40%' readonly>
    目标：想在iframe里显示纯文本，与textarea里的一模一样要求：
    1.<!--希望注释能显示出来-->
    2.希望换行能显示出来
    3.希望iframe可以自动换行，不要横向滚动
    4.希望iframe中的英文字体设置为textarea中的默认字体问题：当有一串标点时不能自动换行，出现了横向滚动条，怎么解决？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？说明：我不需要在iframe或textarea里编辑文本，只要iframe里显示的文本与textarea里显示的一样就好了。用table或是div达到效果也可以。代码：这是一段完整的代码
    </textarea>
    <iframe id=demo style='width:100%; height:40%;' marginheight="0" marginwidth="0"></iframe>
    <script>
    /////////////////////////////51windows/////////////////////////////
    newForm=document.createElement("<div style='word-break:break-all;font:menu;'></div>")
    newForm.innerText = text.value
    demo.document.write(newForm.outerHTML)
    demo.document.close()
    </script>
    <iframe id=demo1 style='width:100%; height:40%' marginheight="0" marginwidth="0" style='display:none'></iframe>
    <script>demo1.document.designMode="on"</script>
    <script>
    /////////////////////////////lfecnu/////////////////////////////
    demo1.document.write("<xmp>"+text.value+"</xmp>")  //此处更改
    demo1.document.close()
    </script>
      

  3.   

    to  yeefly(Web开发版)下面table里少了一行问号
    “？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？”
    你能帮我找回来吗？
    <textarea id="text" name="vv" style="width:100%;height:40%;font-family:宋体; font-size: 9pt" readonly>
    目标：想在iframe里显示纯文本，与textarea里的一模一样要求：
    1.<!--希望注释能显示出来-->
    2.希望换行能显示出来
    3.希望iframe可以自动换行，不要横向滚动
    4.希望iframe中的英文字体设置为textarea中的默认字体问题：当有一串标点时不能自动换行，出现了横向滚动条，怎么解决？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？？说明：我不需要在iframe或textarea里编辑文本，只要iframe里显示的文本与textarea里显示的一样就好了。用table或是div达到效果也可以。代码：这是一段完整的代码
    </textarea>
    <script>
    /////////////////////////////51windows/////////////////////////////
    oTable=document.createElement("<table style='table-layout:fixed;border:solid 1px red;word-break:break-all;'></table>")
    oTbody = document.createElement("tbody")
    oTr = document.createElement("tr")
    oTd = document.createElement("td")
    oTable.appendChild(oTbody)
    oTbody.appendChild(oTr)
    oTr.appendChild(oTd)
    oTd.vAlign = "top"
    oTd.style.fontFamily = text.style.fontFamily
    oTd.style.fontSize = text.style.fontSize
    oTd.innerText = text.value
    document.body.appendChild(oTable){
    oTd.innerText = text.value
    }
    </script>
      

  4.   

    看这个可以吗
    <textarea id="text" rows="12" cols="36" onkeyup="getText()" style="width:200;height:200;font-family: Tahoma; font-size: 9pt" name="vv">
    </textarea><script>
    oTable=document.createElement("<table  style='table-layout:fixed;word-break:break-all;'></table>")
    oTbody = document.createElement("tbody");
    oTr = document.createElement("tr");
    oTd = document.createElement("td");
    oTable.appendChild(oTbody);
    oTbody.appendChild(oTr);
    oTr.appendChild(oTd);
    oTd.vAlign = "top";
    oTd.style.fontFamily = text.style.fontFamily;
    oTd.style.fontSize = text.style.fontSize;
    oTd.innerText = text.value;
    oSpan = document.createElement("span");
    oSpan.style.overflowY = "scroll";oSpan.style.height = "200";
    oSpan.style.width = 200;
    oSpan.appendChild(oTable);
    oSpan.style.border = "solid 1px #bbb";
    document.body.appendChild(oSpan);function getText()
    {
    oTd.innerText = text.value;
    oSpan.scrollTop = 1000;
    }
    </script>
      

  5.   

    <SCRIPT LANGUAGE="JScript">
    function showInIfameAsText()
    {
    with (demo.document)
    {
    open("text/plain", "replace");
    write(txa.value);
    }

    }
    </SCRIPT>
    Iframe显示区:
    <BR>
    <iframe id=demo style='width:60%; height:40%;' marginheight="0" marginwidth="0"></iframe>
    <BR>
    写字板: <button onclick="showInIfameAsText()">显示写字板内容</button>
    <BR>
    <TEXTAREA id="txa" ROWS="20" COLS="40" style="width:60%">
    在这里写字,然后按按钮,内容将按文本格式写入Iframe
    </TEXTAREA>
      

  6.   

    用text/plain不能调控显示的字体样式,且无法控制回行.完美版:<BODY>
    <SCRIPT LANGUAGE="JScript">
    function showInIfameAsText(val)
    {
    with (demo.document)
    {
    open("text/html", "replace");
    writeln("<xmp style='width:100%;word-wrap:break-word;font-family:"+ txa.currentStyle.fontFamily +";color:" + txa.currentStyle.color + ";font-size:" + txa.currentStyle.fontSize + "'>");
    writeln(val);
    writeln("</xmp>");
    close();
    }

    }
    </SCRIPT>
    Iframe显示区:
    <BR>
    <iframe id=demo style='width:60%; height:40%;' marginheight="0" marginwidth="0"></iframe>
    <BR>
    写字板: <button onclick="showInIfameAsText(txa.value)">显示写字板内容</button>
    <BR>
    <TEXTAREA id="txa" ROWS="20" COLS="40" style="width:60%;font-family:宋体;color:red;font-size:14pt">
    在这里写字,然后按按钮,内容将按文本格式写入Iframe
    </TEXTAREA>
    </BODY>
      

  7.   

    已经用了word-break:break-all;来控制，但是这个功能只能在IE5.5以上版本才行