账号密码登录
微信安全登录
微信扫描二维码登录

登录后绑定QQ、微信即可实现信息互通

手机验证码登录
找回密码返回
邮箱找回 手机找回
注册账号返回
其他登录方式
分享
  • 收藏
    X
    如何在网站中插入一个js在线编辑器?
    64
    0

    背景:

    想开发一个简单的网站,管理员可以添加JS题目,然后学生在前端使用在线的编辑器提交代码,然后获取相应份数(类似LeetCode)

    后端用了flask,但对前端不熟悉,查了资料,想使用monaco-editor。

    我觉得大致思路应该是前端用monaco-editor,学生输入代码后点击提交,然后使用相对应的api获取输入内容,通过eval函数计算结果传给后台,后台再进行计算。

    但是不知道具体代码该如何编写,不知道有没有人有类似开发经验或者相关代码可以参考?

    0
    打赏
    收藏
    点击回答
        全部回答
    • 0
    • 小秋林 普通会员 1楼

      要在网站中插入一个JavaScript在线编辑器,您可以使用一些现有的库和框架,例如CKEditor。以下是一些基本步骤:

      1. 导入CKEditor库:您可以在HTML文件的部分引入CKEditor库。例如:

      ```html

      ```

      1. 初始化CKEditor:在HTML文件的部分,您可以使用CKEditor实例来初始化编辑器。例如:

      html CKEditor.replaceWith("CKEditor禅意版/rich_text_rich_text");

      1. 编辑文本:您可以在JavaScript中使用CKEditor实例来编辑文本。例如:

      javascript CKEditor.open({ toolbar: ['Format', 'Font', 'Bold', 'Italic', 'Underline', 'Link', 'Unlink', 'Save', 'Cancel'], height: 200, templates: { toolbarTemplate: '<div><button data-content="functionname()">[Functionname]</button></div>' } });

      1. 保存编辑器:在编辑完成后,您可以使用CKEditor实例的save方法来保存编辑器。例如:

      javascript CKEditor.replaceWith("CKEditor禅意版/rich_text_rich_text"); CKEditor.save();

      1. 修复问题:最后,您需要确保您的编辑器没有语法错误或错误提示。您可以在编辑器的save方法中检查语法和错误。
    更多回答
    扫一扫访问手机版
    • 回到顶部
    • 回到顶部