在AJAX中向表添加JSON数据 - javascript

好的,我从输入框中有一些搜索结果。我使用keyup获得结果。然后此结果发送到AJAX,我想将其附加到表中。我的问题是因为如果我有更多结果,我将使用append来获取多个表头,另一方面,由于脚本使用for循环,因此我将无法使用html(),因此我只会得到一个结果。有人可以帮我解决这个问题。我尝试这样的事情...

$("#search").keyup(function () 
    {
       var value = $(this).val(); // varijabla iz input polja
       // provera za minimalnu duzinu pretrage
       if(value.length > 3)
       {
            $.ajax({
                type: "POST",
                url: "crud/searching/",
                data: { 'var' : value },
                dataType: "json",
                success: function(response)
                {    alert(response);  
                    $('#warning').html(response.msg);;
                    $('#result').html('');

                    for(var i=0; i<response.result.length; i++)  //petlja za pristup json
                    {
                        $('#result').append('<table class="page-list"><thead><tr><th>#</th><th>Naslov</th><th>Autor</th><th>Cena</th><th>Valuta</th></tr><thead><tbody><tr><td>'+ response.result[i].id +'</td><td>'+ response.result[i].naslov +'</td><td>'+ response.result[i].autor +'</td><td>'+ response.result[i].cena +'</td><td>'+ response.result[i].valuta +'</td></tr> </tbody></table> ' );//dodavanje rezultata u div

                    }                                                     
                } 
            })
        }
    });

参考方案

只需创建一次表,然后将循环中的tr追加到其tbody

$('#warning').html(response.msg);
if (response.result.length) {
    var $table = $('<table class="page-list"><thead><tr><th>#</th><th>Naslov</th><th>Autor</th><th>Cena</th><th>Valuta</th></tr><thead><tbody></tbody></table>').appendTo($('#result').html(''));
    var $tbody = $table.find('tbody');

    for (var i = 0; i < response.result.length; i++) //petlja za pristup json
    {
        $tbody.append('<tr><td>' + response.result[i].id + '</td><td>' + response.result[i].naslov + '</td><td>' + response.result[i].autor + '</td><td>' + response.result[i].cena + '</td><td>' + response.result[i].valuta + '</td></tr>  '); //dodavanje rezultata u div
    }
} else {
    $('#result').html('')
}

如何在HTML选项中添加onClick? - javascript

我要尝试的是单击<option>时,该值将显示在<input type='text'>中现在是我的代码:<select id='months'> <option value='9' id='months9'>9 Months<…

带有AJAX和DOM处理API的下拉菜单 - javascript

我从API获取数据,但未在我的下拉菜单中显示。如果我用?act=showprovince回显,结果就在那里。example.html<head> <link rel="stylesheet" type="text/css" href="css/normalize.css"> …

使用php重新加载内容 - javascript

在对网站进行编程时,我以前使用过此代码,它可以完美工作,但是现在当我想使用一些Flash部件时,每次单击链接时,它都会重新加载所有网站。源代码: <!DOCTYPE html> <html> <head> <title>Hot King Staff</title> <meta charset=…

包含“。”的onClick函数参数 - javascript

我正在尝试创建一个表,该表包含该表的“更改密码”列中各项的onClick函数,以便我的系统管理员可以更改每个人的密码。每个onClick都会调用函数“ ChangePassOpen”,该函数将打开一个带有新密码输入框和另一个按钮的模式,以实际调用该函数来更改密码。为了使我的程序能够识别管理员正在更改的帐户,我需要将用户名作为参数传递,但是我的用户名包含“。”…

尽管刷新,jQuery格式仍未应用于Ajax数据 - javascript

我正在通过GET响应消息从服务器(php文件)的可折叠内部加载列表视图。但是,尽管刷新了jQuery元素,但jQuery格式并未应用于添加的HTML。我的页面在这里:http://i.cs.hku.hk/~hsbashir/Project_Work/events/events.htmlHTML代码(仅相关代码)<script> lastRecor…