Question

我有一个iFrame来创建一条消息。但是，当我在输入iFrame时按Enter键时，它会创建另一个div，但是，我希望它创建一个<br/>。我尝试使用execCommand insertBrOnReturn，但我没有让它工作。有什么想法吗？提前谢谢！

stackoverflow中的JSFiddle并没有真正起作用，但我现在已经有了#f; Craz1k0ek / d869w67b /＆＃34;在默认的jsfiddle.net之后

＆＃13;

function iFrameOn() {
    richTextField.document.designMode = 'On';
    richTextField.document.body.style.fontFamily = 'Open Sans,Helvetica Neue,Helvetica,Arial,sans-serif';
}
function iBold() {
    richTextField.document.execCommand('bold', false, null);
}
function iUnderline() {
    richTextField.document.execCommand('underline', false, null);
}
function iItalic() {
    richTextField.document.execCommand('italic', false, null);
}
function submit_form() {
    var theForm = document.getElementById("myForm");
    theForm.elements["myTextArea"].value = window.frames['richTextField'].document.body.innerHTML;
    theForm.submit();
}

＆＃13;

<body onload="iFrameOn()">
  <form action="" name="myForm" id="myForm" method="post">
    <p>
      Title
      <input name="title" id="title" type="text" size="80" maxlength="80">
    </p>
    <div id="wysiwyg_cp" style="padding:8px; width:700px;">
      <input type="button" onClick="iBold()" value="B">
      <input type="button" onClick="iUnderline()" value="U">
      <input type="button" onClick="iItalic()" value="I">
    </div>
    <textarea style="display:none;" name="myTextArea" id="myTextArea" cols="100" rows="14"></textarea>
    <iframe name="richTextField" id="richTextField" style="border:#000 1px solid; width:700px; height:300px;"></iframe>
    <input name="myBtn" type="button" value="Submit Data" onClick="javascript:submit_form();">
  </form>
</body>

＆＃13;

Answer 1

我更改了submit_form函数，如下所示：

function submit_form() {
    remove_divs();
    var theForm = document.getElementById("myForm");
    theForm.elements["myTextArea"].value = window.frames['richTextField'].document.body.innerHTML;
    theForm.submit();
}

然后我添加了remove_divs函数，如下所示：

function remove_divs() {
    var frameHTML = window.frames['richTextField'].document.body.innerHTML;
    frameHTML = frameHTML
        .replace(/<div><br><\/div>/g, '')
        .replace(/<div>/g, '<p>')
        .replace(/<\/div>/g, '</p>');
    $(window.frames['richTextField'].document.body).html(frameHTML);
}

它将所有<div><br></div>元素替换为空，然后用<div>替换所有<p>元素，用</div>替换所有</p>元素。这将完全按照我的要求格式化字段中的文本。

然后我遇到了设置DesignMode = 'On';的问题，我通过在javascript文件中添加额外代码来解决这个问题，如下所示：

window.onload = function() {
    window.frames['richTextField'].document.designMode = "On";
}

我还获得了一些关于我如何获得对richTextField的访问权限的警告，因此我替换了richTextField.document.execCommand的所有window.frames['richTextField'].document.execCommand元素。

我希望这有帮助！

iFrame打破输入键

1 个答案: