javascript - jQuery HTML 到 JSON

Question

我正在使用 jQuery 模板插件从 JSON 数据生成 HTML，用户可以操作(并可能更改)。我正在寻找一种方法将此 html 读回 JSON，以便将其保存回我的服务器。 jQuery 提供了一个 $.tmplItem()返回原始设置 data JSON 的方法，但我想知道如何获取当前 DOM 中的值？

Answer 1

这个怎么样？

http://jsfiddle.net/mWuHe/14/

提取你所在区域的 HTML，然后将其转换回 JSON:

$(':button').click(function() {
    $('#output').text(JSON.stringify({ 
        data:$('#input').html() 
    }));
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="input" contenteditable="true" style="border: 1px solid;width:300px; height:100px;"><b>Edit me!</b> You can use CTRL+B to change bold, ctrl+I to change italics.</div>
<div style="clear:both;">
    <input type="button" value="Get HTML">
</div>
<div id="output" style="border: 1px solid;clear:both;width:300px;height:100px;font-family:courier;font-size:10px;">

</div>

顺便说一句，为了简单起见，我使用了 JSON.stringify，但在生产环境中，您可能应该使用像 jquery-json 这样的库，因为一些不支持它的旧浏览器仍在四处游荡。