关于JQ遍历取值保存的问题
我写了一个遍历DOM并取值赋值给数组，以下代码存在错误
是否可以保存成JSON呢？如果保存成JSON怎么写
- HTML code
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>无标题文档</title><style> body{ font-size:12px;} #tb1 { width:1000px; float: left;} #tb1 span{ float:left; text-align:center;} #tb1 span input{ width:20px;} #tb2 { width:1000px; float: left;} #tb2 span{ width:32px; border-right:solid 1px #CCC; float:left;} #tb2 span input{ width:10px;} .qujian_td{ width:80px;} .kuohao{ padding-left:15px; padding-right:15px;}</style></head><script type="text/javascript" src="http://127.0.0.5/includes/libraries/javascript/jquery.js" charset="utf-8"></script><body><table cellspacing="0" cellpadding="0"> <tr class="tb1"> <td width="95">0<span class="kuohao">≤</span> <input type="text" class="qujian" onkeyup="num_v();" style="width:30px;" maxlength="5" /></span></td> <td><a href="javascript:;" class="add">增加</a></td> </tr> <tr> <td align="left"> <input type="text" class="shibiema" style="width:30px;" onkeyup="num_v();" maxlength="5" /></td> <td id="add_a"> </td> </tr> <tr class="tb1"> <td width="95">0<span class="kuohao">≤</span> <input type="text" class="qujian" onkeyup="num_v();" style="width:30px;" maxlength="5" /></span></td> <td><a href="javascript:;" class="add">增加</a></td> </tr> <tr> <td align="left"> <input type="text" class="shibiema" style="width:30px;" onkeyup="num_v();" maxlength="5" /></td> <td id="add_a"> </td> </tr> <tr class="tb1"> <td width="95">0<span class="kuohao">≤</span> <input type="text" class="qujian" onkeyup="num_v();" style="width:30px;" maxlength="5" /></span></td> <td><a href="javascript:;" class="add">增加</a></td> </tr> <tr> <td align="left"> <input type="text" class="shibiema" style="width:30px;" onkeyup="num_v();" maxlength="5" /></td> <td id="add_a"> </td> </tr> <tr> <td colspan="2" align="left" onclick="save_data();">保存</td> </tr> </table><script>$(document).ready(function(){ $(".add").click(function(){ $(this).parent().before("<td class=\"qujian_td\"><span class=\"kuohao\">≤</span><input type=\"text\" class=\"qujian\" onkeyup=\"num_v();\" style=\"width:30px;\" maxlength=\"5\" /></span></td>"); $(this).parent().parent().next().find("#add_a").before("<td><input type=\"text\" class=\"shibiema\" style=\"width:30px;\" onkeyup=\"num_v();\" maxlength=\"5\" /></td>"); });}); function num_v(){ $(".shibiema").each(function(i) { $(this).val($(this).val().replace(/[^\d]/g,'')); }); $(".qujian").each(function(i) { $(this).val($(this).val().replace(/[^\d]/g,'')); }); } function save_data(){ var mydata=new Array() $(".tb1").each(function(h) { $(this).find(".qujian").each(function(i) { mydata[h][i][0]=$(this).val(); }); $(this).next().find(".shibiema").each(function(i) { mydata[h][i][1]=$(this).val(); }); }); alert(mydata); }</script></body></html>
[解决办法]
- HTML code
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=gbk" /><title>无标题文档</title><style> body{ font-size:12px;} #tb1 { width:1000px; float: left;} #tb1 span{ float:left; text-align:center;} #tb1 span input{ width:20px;} #tb2 { width:1000px; float: left;} #tb2 span{ width:32px; border-right:solid 1px #CCC; float:left;} #tb2 span input{ width:10px;} .qujian_td{ width:80px;} .kuohao{ padding-left:15px; padding-right:15px;}</style></head> <script src="http://code.jquery.com/jquery-latest.js"></script><body><table cellspacing="0" cellpadding="0"> <tr class="tb1"> <td width="95">0<span class="kuohao">≤</span> <input type="text" class="qujian" onkeyup="num_v();" style="width:30px;" maxlength="5" /></span></td> <td><a href="javascript:;" class="add">增加</a></td> </tr> <tr> <td align="left"> <input type="text" class="shibiema" style="width:30px;" onkeyup="num_v();" maxlength="5" /></td> <td id="add_a"> </td> </tr> <tr class="tb1"> <td width="95">0<span class="kuohao">≤</span> <input type="text" class="qujian" onkeyup="num_v();" style="width:30px;" maxlength="5" /></span></td> <td><a href="javascript:;" class="add">增加</a></td> </tr> <tr> <td align="left"> <input type="text" class="shibiema" style="width:30px;" onkeyup="num_v();" maxlength="5" /></td> <td id="add_a"> </td> </tr> <tr class="tb1"> <td width="95">0<span class="kuohao">≤</span> <input type="text" class="qujian" onkeyup="num_v();" style="width:30px;" maxlength="5" /></span></td> <td><a href="javascript:;" class="add">增加</a></td> </tr> <tr> <td align="left"> <input type="text" class="shibiema" style="width:30px;" onkeyup="num_v();" maxlength="5" /></td> <td id="add_a"> </td> </tr> <tr> <td colspan="2" align="left" onclick="save_data();">保存</td> </tr> </table><script>$(document).ready(function(){ $(".add").click(function(){ $(this).parent().before("<td class=\"qujian_td\"><span class=\"kuohao\">≤</span><input type=\"text\" class=\"qujian\" onkeyup=\"num_v();\" style=\"width:30px;\" maxlength=\"5\" /></span></td>"); $(this).parent().parent().next().find("#add_a").before("<td><input type=\"text\" class=\"shibiema\" style=\"width:30px;\" onkeyup=\"num_v();\" maxlength=\"5\" /></td>"); });}); function num_v(){ $(".shibiema").each(function(i) { $(this).val($(this).val().replace(/[^\d]/g,'')); }); $(".qujian").each(function(i) { $(this).val($(this).val().replace(/[^\d]/g,'')); }); } function save_data(){ var mydata=new Array() $(".tb1").each(function(h) { mydata[h] = [] $(this).find(".qujian").each(function(i) { mydata[h][i] = [] mydata[h][i][0]=$(this).val(); }); $(this).next().find(".shibiema").each(function(i) { mydata[h][i][1]=$(this).val(); }); }); alert(mydata); }</script></body></html>
[解决办法]
字符串 a=JSON.stringify(数组)