Question

我想创建一个带有文本区域（或文本编辑器）的网页，我想在框中显示一些日志消息，逐渐添加日志消息。考虑一下，当我们安装一个应用程序时，它会显示有关正在逐步增加的内容的日志。

我已经有一个带编辑器（ace编辑器）的页面，它显示数据，但我遇到了一些问题：

将数据添加到编辑器内容时，将刷新所有框。
除了刷新外，光标出现在方框的开头而不是放在最后。

请帮我找到用于在网页中记录事件的写入组件。谢谢。

Html侧码：

<button
      data-toggle="modal" href="#edit_file_content_modal"
      ng-click="process(migrateResult)"
      class="btn btn-icon-only red"
      uib-popover="Log">

      <i class="fa fa-newspaper-o"></i>
</button>

<div class="modal fade" id="edit_file_content_modal" tabindex="-1" role="dialog" aria-labelledby="edit_file_content_modal">
<div class="modal-dialog modal-lg" role="document">
    <div class="modal-content">
        <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
                    aria-hidden="true">&times;</span></button>
            <h4 class="modal-title" id="edit_file_content_modal-title">File Content</h4>
        </div>
        <div class="modal-body">

            <div>
                <code-editor
                        code-model="content"
                        header-title="header">
                </code-editor>
            </div>



            <div>
                <div class="modal-footer">
                    <button type="button" ng-click="saveFile()" class="btn btn-default" ng-disabled=false>
                        Save
                    </button>
                    <button type="button" class="btn btn-danger" data-dismiss="modal" ng-click="cancelCallback()">
                        Cancel
                    </button>
                </div>
            </div>
        </div>
    </div>
</div>

在js文件中，我会监听一个事件并将收到的数据添加到编辑器内容中并应用更改：

io.socket.on(obj.migrateSourceOwner.sourceFile, function (data) {
    $scope.content += ("\n" + data);
    $scope.$apply();
});

Answer 1

这里是简单的js示例来更新textarea希望它可能有用

var txt = document.getElementById('log');

setInterval(function(){
txt.value += '\ntest';
},2000);

<textarea id='log' rows=50 cols=60 autofocus>


</textarea>

逐步在html文本框中记录事件

1 个答案: