layui整合codemirror解决获取不到textarea值的方法

作者 : MOOMOO 本文共1166个字,预计阅读时间需要3分钟 发布时间: 2022-05-3 共28人阅读

近期在使用thinkphp+layui+codemirror开发的时候,发现一直获取不到textarea的值。百度后发现是codemirror的一个坑。

codeMirror先从 textarea中读取值放到codemirror动态生成的div中,根据textarea中的换行个数确定行数,根据正则表达来高亮语法。这就有个问 题,当你在页面上对语法做出修改提交表单时,其实只是在codemirror上的动态div上做出修改,当form表单提交时,原来textarea值并没有变化。

layui代码

  1. <textarea id=”code” name=”code”>{$code}</textarea>
  2. <script>
  3.     layui.use([‘form’, ‘layer’,’layedit’], function () {
  4.         var form = layui.form, layer = layui.layer, $= layui.jquery;
  5.         var editor = CodeMirror.fromTextArea(document.getElementById(“code”), {
  6.   mode: “application/xml”,
  7.   styleActiveLine: true,
  8.   lineNumbers: true,
  9.   lineWrapping: true
  10. });
  11. form.on(‘submit(submit)’, function (data) {
  12.     var loading = layer.load(1, {shade: [0.1, ‘#fff’]});
  13.     var content = editor.getValue();//此处获取code的值
  14.             $.post(“”, {content:content}, function (res) {
  15.                 layer.close(loading);
  16.                 if (res.code > 0) {
  17.                     layer.msg(res.msg, {time: 1800, icon: 1}, function () {
  18.                         location.href = res.url;
  19.                     });
  20.                 } else {
  21.                     layer.msg(res.msg, {time: 1800, icon: 2});
  22.                 }
  23.             });
  24.         });
  25.     });
  26. </script>
1. 本站所有资源来源于用户上传和网络,仅作为演示数据,如有侵权请邮件联系站长!
2. 本站客服QQ:4387159,唯一购买官网:MooMoo.TOP!
3. 盗版,破解有损他人权益和违法作为,请各位会员支持正版!
MooMoo » layui整合codemirror解决获取不到textarea值的方法

常见问题FAQ

是否支持共享资源赚外快?
本站支持任何人上传资源,一经采用即可展示,客户下单既有80%的提成。
可以免费教技术吗?
大家可以加群进行探讨共同进步,重点问题管理员会进行解答。
我是小白要怎么学习?
加群后做到不耻下问,看文章学习演示就能成为大佬。

发表评论