• 企业400电话
  • 微网小程序
  • AI电话机器人
  • 电商代运营
  • 全 部 栏 目

    企业400电话 网络优化推广 AI电话机器人 呼叫中心 网站建设 商标✡知产 微网小程序 电商运营 彩铃•短信 增值拓展业务
    百度编辑器从Json对象中取值,完成初次渲染,在编辑器内画表格
    第一次做企业级应用,感觉一点:对逻辑必须要非常明确,而且有了很多与之前不一样的概念。
    在百度编辑器中,如何完成从服务器取值,来渲染出表格?这里需要先console.log(editor);在官方API中已经告诉我们写入的方法是setContent(),这里只要能传入我们最终拼好的的字符串,即可以在初始化中,绘制出我们想要的任何节点。
    再send()完成之后,onreadystatechange = function(){},先上一段AJAX的代码。这段AJAX是消除游览器兼容,从尼古拉斯的书中学到。
    复制代码 代码如下:

    function AJAX() {
    if (typeof XMLHttpRequest != "undefined") {
    return new XMLHttpRequest();
    } else if (typeof ActiveXObject != "undefined") {
    if (typeof arguments.callee.activeXString != "string") {
    var versions = ["MSXML2.XMLHttp.6.0", "MSXML2.XMLHttp.3.0", "MSXML2.XMLHttp"];
    for (var i = 0, len = versions.length; i len; i++) {
    try {
    var xhr = new ActiveXObject(versions[i]);
    arguments.callee.activeXString = versions[i];
    return xhr;
    } catch (ex) {
    }
    }
    }
    return new ActiveXObject(arguments.callee.activeXString);
    } else {
    throw new Error("错误");
    }
    }

    在JSON数据集中,我们知道,这是一对key value的数据集。在我们从服务器端取到Json对象时,我们就要开始解析它,然后再生成,我们需要的DOM节点。比如,如下一对JSON数据集。
    复制代码 代码如下:

    {
    "head":{
        "rows":3,
    "cells":2     
     },
    "body":{
        "rows":3,
    "cells":2     
     }
    }

    接下来,我们取得的数据是存储在responseText中的,所以,还需要设置一个变量接受一下,如此var a = eval("("+xhr.responseText+")");到了这一步,我们整个Json对象,就从服务端取了出来。接着for in它,就可以取到在Json对象中存储的数据。
    复制代码 代码如下:

    for (var b in a) {
    console.log(a[b].rows);
    }
    //for in遍历Json对象,b就是已经取到了key值了。

    再得到具体的JSON数据集后,就可以通过+= 来拼写节点的字符串,用+=来拼写,从上到下,判断,循环,都可以,只需要在最开始设置一个空变量,来接收这一切。
    最后一步,editor.setContent(Json);即可以完成编辑器可以编辑区域的初始化,从服务端取值,来渲染节点。
    业精于勤,荒于嬉。行成于思,毁于随。新人的成长,在于总结。所有文章与例子,仅是自我总结,都仅供学习交流。
    您可能感兴趣的文章:
    • Vue.js实现可编辑的表格
    • angularjs实现table表格td单元格单击变输入框/可编辑状态示例
    • vuejs+element UI点击编辑表格某一行时获取内容填入表单的示例
    • 使用JavaScript实现表格编辑器(实例讲解)
    • jQuery实现可编辑表格并生成json结果(实例代码)
    • JS表格组件BootstrapTable行内编辑解决方案x-editable
    • JavaScript简单表格编辑功能实现方法
    • javascript实现表格排序 编辑 拖拽 缩放
    • editable.js 基于jquery的表格的编辑插件
    • js+Html实现表格可编辑操作
    上一篇:fckeditor编辑器在php中的配置方法
    下一篇:fckeditor 防止上传非法文件 增加登录判断
  • 相关文章
  • 

    © 2016-2020 巨人网络通讯 版权所有

    《增值电信业务经营许可证》 苏ICP备15040257号-8

    百度编辑器从Json对象中取值,完成初次渲染,在编辑器内画表格 百度,编辑器,从,Json,对象,