Question

我有以下代码从php文档中检索一些文本：

$.get("server/test.php", function(data){
    $('#thumbdest').prepend(data);
    // $('#thumbdest').html(data);
});

注释行按预期返回所有内容，但prepend数据不会。它似乎在插入时剥离HTML标记。我不能使用注释行，因为我必须在彼此之后插入多个项目。 $('#thumbdest').html(data);按预期替换thumbdest div中的所有内容。

以下是使用prepend

时应该获得的HTML

<tr>
    <td>
        <a href="#modal" class="thumbnail tableimg"  role="button" class="btn" data-toggle="modal">           
            <img src="assets/img/huvudbilder/thumbs/img.png" class="tableimg" alt="">
        </a>
    </td>
    <td>Test1</td>
    <td>Test2</td>                
</tr>

这是我使用prepend

实际获得的

<a href="#modal" class="thumbnail tableimg"  role="button" class="btn" data-toggle="modal">
    <img src="assets/img/huvudbilder/thumbs/img.png" class="tableimg" alt="">
</a>
Test1
Test2

这反过来搞砸了整个桌子。所有的表格元素都消失了，为什么会这样？

编辑：在前置之后测试alert(data)时，我得到以下内容：

<tr>
    <td>
        <a href="#editImage_1222866094" class="thumbnail tableimg"  role="button" class="btn" data-toggle="modal">

            <img src="assets/img/huvudbilder/thumbs/favicon32.png" class="tableimg" alt="">
        </a>
    </td>
    <td>Test1</td>
    <td>Test2</td>                     
</tr>

#thumbdest的结构：

        <table class="table table-hover">
          <p>&nbsp;</p>
            <thead>
                <tr>
                    <th></th>
                    <th>Namn</th>
                    <th>Tid</th>
                </tr>
            </thead>
            <tbody id="thumbdest"></tbody>
            <tbody>
                <?php getImageList($conn); ?>
            </tbody>
        </table>

Answer 1

<!DOCTYPE HTML>
<html lang="en-US">
<head>
    <meta charset="UTF-8">
    <title>Script Test</title>
    <script src="jquery.min.js"></script>
    <script>

    // example

        $(function() {
            $('.button').click(function(e) {
                e.preventDefault();
                var $mytext = "<a href=\"#\">Test</a>";
                    $("#key").prepend($mytext);

                });
        });

    </script>
</head>
<body>

    <a href="" class="button">Test</a>
    <div id="key"></div>

</body>
</html>

在这里，prepend()正在按预期工作，而不是剥离标签。

您需要做什么是将<tbody>置于<div id="thumbdest">内，然后将以下脚本行从$('#thumbdest').prepend(data);更改为$('#thumbdest tbody').prepend(data);

来源：http://forum.jquery.com/topic/prepend-stripping-out-html-table-tags

jQuery，Prepend数据条带html标签，输出搞砸了

1 个答案: