Question

我在编写jquery Loop时遇到困难，以便从数据库中获取多个数据。以下是我的html doc的摘录。

<form id="forgotpswdform" method='post'>
<b>Name:<b><br>
<input type="text" id='myname' name='myname' required pattern="[A-Za-z0-9.-_  
]{5,10}"><br><br>
<b>Password:<b><br>
<input id="mypswd" name="mypswd" type="password" required pattern="[A-Za-z0-
9&*]{8,12}"><br><br>
<table id="syruptbl">
<tbody>
<tr>
<th>SYRUP</th>
<th>GNAME</th>
</tr>
<tr>
<td><input id="syrup1" name="syrup1" type="text"></td>
<td><input id="gnme1" name="gnme1" type="text">
</tr>
<tr>
<td><input id="syrup2" name="syrup2" type="text"></td>
<td><input id="gnme2" name="gnme2" type="text"><br>
</tr>
</tbody>
</table>
</form>

这是我的jquery脚本。（目的是保持同一页面。）

        <script>
        $(document).ready(function() {
            $("#mypswd").change(function() {
                var mydata = {
                myname : $("#myname").val(), 
                mypswd : $("#mypswd").val(),
                };         
                $.post("syrp_tbl.php", my2data, function(data) {
                   var a = data.indexOf(",");
                   var b = a + 1;
                   var res = data.slice(0, a);
                   $('#syrup1').text(res);

                   data = data.slice(b);
                   a = data.indexOf(",");
                   b = a + 1;
                   res = data.slice(0, a);
                   $('#gnme1').text(res);

                   data = data.slice(b);
                   a = data.indexOf(",");
                   b = a + 1;
                   res = data.slice(0, a);
                   $('#syrup2').text(res);

                   data = data.slice(b);
                   $('#gnme2').text(data);         
               });
           });
        });    
        </script>

这很好用。但是，数据越多，脚本的时间就越长。如何使用jquery循环，循环while或任何其他方法对此进行排序？谢谢。

Answer 1

从服务器返回JSON，并在客户端上循环访问JSON数组：

如果您的服务器返回：

{Items: [
    {"Item": "lol", "Key": "wtf"},
    {"Item": "kewl", "Key": "rofl"}
]}

然后

$.post("syrp_tbl.php", my2data, function(data) {
    data = $.parseJSON(data); // You might not need this, depending on your config
    $(data.Items).each(function(){
        $("#syruptbl").append(
            $("<tr>").append(
                $("<td>").text(this["Item"])
            ).append(
                $("<td>").text(this["Key"])
            )
        );
    });
});

JQuery从数据库

1 个答案: