jQuery HTML到JSON

Question

我正在使用jQuery模板插件從用戶比操縱（和，可能改變）JSON數據生成HTML。我正在尋找一種方法將這個html讀回JSON，以便我可以將它保存回我的服務器。 jQuery提供了一個返回最初設置的data JSON的$.tmplItem()方法，但我想知道如何獲取當前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>

BTW我用JSON.stringify爲simplicty，但在生產環境中，應該可能使用像jquery-json這樣的庫，因爲一些不支持的老瀏覽器仍然在偷偷摸摸。

Answer 2

完成這項工作的最好方法是某種數據綁定，例如jQuery data link plugin或（對於您目前的需求可能有點多）Knockout。