通过 javascript & jquery 从数据库中检索数据

Question

我有以下代码：

var _this = this,
                $div = _this.$div,
                opts = _this.settings,
                $table = $div.find(opts.tableSelector);

var listaCamposAExibir = ["Identificação Direta", "Identificação Indireta", "Total", "REINCIDÊNCIAS COM IDENTIFICAÇÃO DIRETA", "REINCIDÊNCIAS COM IDENTIFICAÇÃO INDIRETA", "Total", "TOTAL DE IDENTIFICAÇÕES N"];

            var i = 0;

            document.write('<table>')

            for (var j = 0; j < list.length; j++) {
                i = 0;
                for (p in list[j]) {
                    if (p === "Nome") {
                        document.write('<tr>');
                        document.write('<td>' + list[j][p] + '</td><td></td>');
                        document.write('</tr>');
                    } else {
                        if(p === "TotalGeral" && list[j].Nome === "Interior"){
                            document.write('<tr>');
                            document.write('<td>' + listaCamposAExibir[i] + 'O INTERIOR</td><td>' + list[j][p] + '</td>');
                            document.write('</tr>');
                        } else {
                            if(p === "TotalGeral" && list[j].Nome === "Metropolitana"){
                                document.write('<tr>');
                                document.write('<td>' + listaCamposAExibir[i] + 'A CAPITAL</td><td>' + list[j][p] + '</td>');
                                document.write('</tr>');
                            } else {
                                document.write('<tr>');
                                document.write('<td>' + listaCamposAExibir[i] + '</td><td>' + list[j][p] + '</td>');
                                document.write('</tr>');
                                i++;
                            }
                        }                       
                    }
                }
            }

            document.write('<tr><td>TOTAL:</td><td>' + (parseInt(list[0].TotalGeral) + parseInt(list[1].TotalGeral)) + '</td></tr>');

            document.write('</table>')

以及以下 html：

<div class="form-list-result resultadosDaPesquisa hidden">
        <div class="form-list-result-header resultadosDaPesquisa hidden">
            <label>Resultado da Pesquisa</label>
        </div>
        <table class="table" width="100%">
        </table>
    </div>

但是当我点击按钮时，table 继续为空，只有

我用document.write的时候，经常出现table，像这样：

Interior    
Identificação Direta                         2
Identificação Indireta                       3
Total                                        5
REINCIDÊNCIAS COM IDENTIFICAÇÃO DIRETA       1
REINCIDÊNCIAS COM IDENTIFICAÇÃO INDIRETA     1
Total                                        2
TOTAL DE IDENTIFICAÇÕES NO INTERIOR          7
Metropolitana   
Identificação Direta                         3
Identificação Indireta                       2
Total                                        5
REINCIDÊNCIAS COM IDENTIFICAÇÃO DIRETA       1
REINCIDÊNCIAS COM IDENTIFICAÇÃO INDIRETA     1
Total                                        2
TOTAL DE IDENTIFICAÇÕES NA CAPITAL           7
TOTAL:                                       14

而在数据库中查询的结果是这样的：

Nome            IdDireta IdIndireta SubTotal RIdDireta RIdIndireta RSubTotal  Total
Interior        2        3          5        1         1           2          7
Metropolitana   3        2          5        1         1           2          7

Answer 1

您需要将 HTML 放入字符串中，然后将元素的 innerHTML 属性设置为该字符串。

试试这个

在 html

中为您的 table 添加一个 ID

<div class="form-list-result resultadosDaPesquisa hidden">
    <div class="form-list-result-header resultadosDaPesquisa hidden">
        <label>Resultado da Pesquisa</label>
    </div>
    <table id="mytable" class="table" width="100%">
    </table>
</div>

然后把你的javascript改成这个

var _this = this,
    $div = _this.$div,
    opts = _this.settings,
    $table = $div.find(opts.tableSelector);

    var listaCamposAExibir = ["Identificação Direta", "Identificação Indireta", "Total", "REINCIDÊNCIAS COM IDENTIFICAÇÃO DIRETA", "REINCIDÊNCIAS COM IDENTIFICAÇÃO INDIRETA", "Total", "TOTAL DE IDENTIFICAÇÕES N"];

    var i = 0;
    var t = '';
    t += '<table>'

    for (var j = 0; j < list.length; j++) 
    {
        i = 0;
        for (p in list[j]) 
        {
            if (p === "Nome") 
            {
                t += '<tr>';
                t += '<td>' + list[j][p] + '</td><td></td>';
                t += '</tr>';
            } 
            else 
            {
                if(p === "TotalGeral" && list[j].Nome === "Interior")
                {
                    t += '<tr>';
                    t += '<td>' + listaCamposAExibir[i] + 'O INTERIOR</td><td>' + list[j][p] + '</td>';
                    t += '</tr>';
                } 
                else 
                {
                    if(p === "TotalGeral" && list[j].Nome === "Metropolitana")
                    {
                        t += '<tr>';
                        t += '<td>' + listaCamposAExibir[i] + 'A CAPITAL</td><td>' + list[j][p] + '</td>';
                        t += '</tr>';
                    } 
                    else 
                    {
                        t += '<tr>';
                        t += '<td>' + listaCamposAExibir[i] + '</td><td>' + list[j][p] + '</td>';
                        t += '</tr>';
                        i++;
                    }
                }                       
            }
        }
    }

    t += '<tr><td>TOTAL:</td><td>' + (parseInt(list[0].TotalGeral) + parseInt(list[1].TotalGeral)) + '</td></tr>';

    t += '</table>';

    document.getElementById("mytable").innerHTML = t;

通过 javascript & jquery 从数据库中检索数据

Retrieve data from database throught javascript & jquery

javascript

sql

database

jquery

jquery-ui