Question

大家好我试图在js中创建一个函数，允许用户编辑div中的文本。这是我的观点：

@endsection
 <div onload="InitEditable ();" id="content-link2"></div>
@show

这里我的HTML文件加载在div id =＆＃34; content-link2＆＃34; ::

中

<!DOCTYPE html>

<html>
<head>
    <title>Template 1</title>
  <link href="http://localhost/fyproject/public/templates/css.css" rel="stylesheet" type="text/css">

</head>
<body class="pink">
<div  contenteditable="true" id="content" class="draggable ui-widget-content pink"><p>hello</p></div>
<div id="comments">
<form name="forma">
<textarea name="commentUser" id="commentUser" cols="40" rows="5">
Comments here...
</textarea><br>
<input type="submit" value="Ready!" onClick="writeComment(e);" />
</div>

</form>
</body>
</html>

JS ::

var editorDoc;
 function InitEditable () {
var editor = document.getElementsById('content-link2');
 editorDoc = editor.contentWindow.document;          
            var editorBody = editorDoc.div;

                // turn off spellcheck
            if ('spellcheck' in editorBody) {    // Firefox
                editorBody.spellcheck = false;
            }

            if ('contentEditable' in editorBody) {
                    // allow contentEditable
                editorBody.contentEditable = true;
            }
            else {  // Firefox earlier than version 3
                if ('designMode' in editorDoc) {
                        // turn on designMode
                    editorDoc.designMode = "on";                
                }
            }
        }

我将解释一个过程。客户点击图像，在div中加载html文件。我然后允许用户移动div与html文件，现在我想允许客户更改该div内的文本

Answer 1

为什么不试试contenteditable。

例如：

＆＃13;

<div contenteditable="true">Type to edit...</div>

＆＃13;

正如MDN - Making Content Editable中所述：

在HTML中，任何元素都可以编辑。通过使用一些JavaScript事件处理程序，您可以将您的网页转换为完整而快速的丰富文本编辑器。本文提供了一些有关此内容的信息功能。

允许用户更改div中的文本

1 个答案: