View on GitHub

Editjson

editjson

Download this project as a .zip file Download this project as a tar.gz file

Edit JSON DATA

1. 以“data”作为根节点
2. 双击“span”标签可以编辑对应的“key”和“value”
   双击之后变成input输入框,自动获得焦点,失去焦点时替换新的值
   验证输入是否包含json的特殊字符,若验证不通过,则恢复为原来取值
3. li标签的hover事件(鼠标进入)
   3.1 会自动在后面添加按钮“Add after this node”
	   点击之后在当前节点后面添加新的键值
   3.2 添加“DELETE”按钮,点击可以删除当前节点,若包含子节点,会一并删除
   3.3 若当前节点不包含子节点,还会增加按钮“insert to this node”
	   点击之后将当前节点“value”插入到当前节点的子节点
4. li标签的hover事件(鼠标移出)会删除按钮
5. “GET JSON DATA”按钮可以将编辑之后的数据转换为JSON格式。