This is the source code of testjson.html.

The code is colored using the Coldfusion code coloring component by Paul Klinkenberg.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
	<title>$.toJSON() tests</title>
	<script type="text/javascript" src="jquery-1.3.2.min.js"></script>
	<script type="text/javascript" src="toJSON.js"></script>
	<script type="text/javascript">
		$().ready(function(){
			$('#convert_btn').click(function(){
				var js_str = $('input[name=js]:checked').next('label').text();
				var js_obj = eval(js_str);
				var data = $.toJSON(js_obj, parseInt($('#compact').val()), parseInt($('#indent').val()));
				$('#txtarea').val( data );
			});
		});
	</script>
	<style type="text/css">
		body { font-family:Arial, Helvetica, sans-serif; font-size:12px;}
		label { padding: 1px 10px 1px 0px; margin-right:15px;}
		label:hover { background-color:#eee;}
		textarea { width:70%;height:300px; background-color:#f6f6f6; }
	</style>
</head>
<body id="body">
	<h1>jQuery.toJSON(object, compact, indent<em>, depth</em>)</h1>
	<p><strong>Parameters:</strong></p>
	<form action="#">
		<table>
			<tr>
				<td><strong>Compact</strong></td>
				<td><select id="compact"><option value="1">true</option><option value="0">false</option></select></td>
				<td><em>add spaces between elements in the json string? This setting is ignored when indent=true</em></td>
			</tr>
			<tr>
				<td><strong>Indent</strong></td>
				<td><select id="indent"><option value="1">true</option><option value="0" selected="selected">false</option></select></td>
				<td><em>this setting allows for indented json formatting.</em></td>
			</tr>
			<tr>
				<td><strong>Depth</strong></td>
				<td>0</td>
				<td><em>The depth paramater is used internally to recursively indent the json string, and to check whether the maximum recursion depth is reached.</em></td>
			</tr>
		</table>
		
		<p><strong>Choose the javascript to convert to json:</strong></p>
		<input type="radio" name="js" id="js1" checked="checked" /><label for="js1">document.getElementById('convert_btn')</label>
		<input type="radio" name="js" id="js2" /><label for="js2">document</label>
		<input type="radio" name="js" id="js3" /><label for="js3">[1,2,3,'hi',{x:1,y:2,z:3},99]</label>
		<input type="radio" name="js" id="js4" /><label for="js4">document.getElementsByTagName('INPUT')</label>
		<input type="radio" name="js" id="js5" /><label for="js5">"I am just a text string"</label>
		<input type="radio" name="js" id="js6" /><label for="js6">1</label><br />
		<button id="convert_btn" type="button">convert to json</button>
		<p><strong>The resulting json:</strong></p>
		<textarea id="txtarea"></textarea>
	</form>
</body>
</html>