2

我有一个使用 PHP 和 Javascript 动态创建的表。现在，我正在尝试为最后一个设置样式<tr>以添加填充和边框，但它不起作用。

我该如何进行？我需要调用一些元素，如 trigger('create') 或其他元素？

我的部分代码：

$.ajax ( {
        beforeSend: function() { $.mobile.showPageLoadingMsg(); }, //Show spinner
        complete: function() { $.mobile.hidePageLoadingMsg() }, //Hide spinner
        url: "http://www.someweb.com/somePHP.php",
        dataType: "json",
        success: function (data, textStatus, jqXHR) {
            for(var i = 0; i< data[1].length;i++){
                table += "<tr><td>"+data[1][i].mon_da+"</td>";
                table += "<td>"+Number(data[1][i].mon_qu).toFixed(2)+"€&lt;/td>";
                table += "<td>"+data[1][i].mon_con+"</td></tr>";
            }
            table += "<tr style='border:1px solid;padding-top:20px;'><td colspan='2'><b>Disp:</b></td><td><b>"+Number(data[0].usr_to).toFixed(2)+"€&lt;/b></td></tr>";
            document.getElementById("tableMo").innerHTML = table;
        }
    });
4

4 回答 4

3

你不能<tr>像这样将样式应用于 s。

您可以尝试将它们应用于<td>s。

我个人更喜欢tr在 CSS 文件中添加一个类并在 JS 外部处理样式。

jsFiddle

HTML

<tr class="stylish">
    <td colspan='2'><b>Disp:</b></td>
    <td><b>"+Number(data[0].usr_to).toFixed(2)+"€&lt;/b></td>
</tr>

CSS

.stylish td {
    border:1px solid #000;
    padding-top:20px;
}
.stylish td:first-child {
    border-right:0;
}
.stylish td:last-child {
    border-left:0;
}
于 2013-04-10T07:31:39.850 回答
0

You can do that using jquery css selector

于 2013-04-10T07:54:22.060 回答
0

您可以通过 id 获取表格元素，然后使用 javascript 添加 CSS 样式属性：

例如：

   document.getElementById("tableMo").style.border = "1px solid black";
document.getElementById("tableMo").style.padding = "10px";

查看一些 DOM 样式教程，它可能会对您有所帮助

http://www.w3schools.com/jsref/dom_obj_style.asp

于 2013-04-10T07:32:20.980 回答
0

这样做的一种方法是向您的tr标签添加一个类，如下所示：

table += "<tr class='rowStyle'><td>"+data[1][i].mon_da+"</td>";

现在您可以设置行的样式，或者如果您想设置表格本身的样式，您可以使用 jquery 来获取行的父级，如下所示：

var obj = $('.rowStyle').closest('table');

并给它一个ID：

$(obj).attr('id','tableID');

现在只需设计它。

虽然这是一个冗长的方法。

希望这可以帮助 ：）

于 2013-04-10T07:32:27.537 回答