帶DOM變量的字符串連接順序錯誤

Question

上下文如下：我正在編寫一個網頁，對某個協會的人進行地理定位，並在wordpress框架內的google地圖上顯示他們的位置。 當我單擊他們的標記時，會顯示一個包含其信息的信息窗口。 在地圖上，我可以使用表單過濾/搜索人員（例如，僅查看名為Paul的人員）。 到目前為止，所有這些工作正常。

我的問題如下：搜索時，我想在地圖下方顯示結果。 由於我可以得到很多結果（通常約為100個結果），因此我希望通過分頁顯示它們。 當我對一些偽文本進行硬編碼時，我設法使用了分頁器。 但是，我無法對搜索結果進行分頁。 如果我做

<div id="pagination"></div>
<table id="content">
<tbody>
    <tr>
        Paul
    </tr>
</tbody>
<tbody>
    <tr>
        John
    </tr>
</tbody>

<tbody>
    <tr>
        Richard
    </tr>
</tbody>
<tbody>
    <tr>
        George
    </tr>
</tbody>
</table>
<script>
    jQuery(function($) {
        var items = $("#content tbody tr");
        var numItems = items.length;
        var perPage = 5;
        items.slice(perPage).hide();
        $("#pagination").pagination({
            items: numItems,
        itemsOnPage: perPage,
            cssStyle: "light-theme",
            onPageClick: function(pageNumber) {                             
                var showFrom = perPage * (pageNumber - 1);
                var showTo = showFrom + perPage;
                items.hide() 
                     .slice(showFrom, showTo).show();
            }
        });
    });
</script>

這是可行的，但是如果我嘗試動態編寫“內容”的html來讀取我的標記的屬性名稱，如下所示：

var pag_res = "";   
document.getElementById('content').innerHTML = "";
for (mark_cnt = 0; mark_cnt < markers.length; mark_cnt++){
    pag_res += "<tbody><tr>" + markers[mark_cnt].desc + "</tbody></tr>";
}
document.getElementById('content').innerHTML = pag_res;

這是行不通的，如果我在控制台中查看document.getElementById（'content'）。innerHTML，則標記的描述是在tbody關閉之后編寫的。 我有類似的東西：Paul John

任何人都不會知道問題出在哪里？

Answer 1

我認為您可以通過編輯以下行來解決此問題：

pag_res += "<tbody><tr>" + markers[mark_cnt].desc + "</tbody></tr>";

最后兩個標簽是錯誤的方法...應該是：

pag_res += "<tbody><tr>" + markers[mark_cnt].desc + "</tr></tbody>";

當您在那里時，也可以整理一下HTML。 一個表應該只有一個，而您缺少標簽...它應該更像是：

<table>
<tbody id="content">
    <tr>
        <td>Paul</td>
    </tr>
    <tr>
        <td>John</td>
    </tr>
    <tr>
        <td>Richard</td>
    </tr>
    <tr>
        <td>George</td>
    </tr>
</tbody>
</table>

注意，我已經將id =“ content”移到了...上，然后您需要對代碼進行調整以使其看起來像：

pag_res += "<tr><td>" + markers[mark_cnt].desc + "</td></tr>";