0

此代码的输出：

<?php
    echo "<script type='text/javascript'> $('#query-info').append('<div class=\"well\">')</script>";
    foreach ($_POST as $key => $entry)
    {
        echo "<script type='text/javascript'> $('#query-info').append('". $key . ": " . $entry . "<br />')</script>";
    }
    echo "<script type='text/javascript'> $('#query-info').append('</div>')</script>";
?>

是：

<div class="well"></div>
itemID: 1
<br>
</div>

注意额外不需要的（第一个）关闭 div。

4

4 回答 4

3

JavaScript 不会将字符串附加到 HTML，它会附加完整的 DOM 节点/元素；不是追加开头，然后是新元素，然后是结束标签，而是追加一个元素，然后追加一个或多个子节点到该新添加的节点：

var newDiv = $('<div />', {'class' : 'well'}),
    otherDiv = $('<div />', {'class' : 'somethingElse'});
newDiv.appendTo('#query-info');
otherDiv.appendTo(newDiv);

以上将导致如下所示：

<div id="query-info">
    <div class="well">
        <div class="somethingElse"></div>
    </div>
</div>
于 2012-08-03T18:57:01.913 回答
2

.append只能附加 HTML 节点，不能只附加开始或结束标签。

让 PHP 生成整个<div>，然后生成.append整个事情。

<?php
    $HTML = '<div class="well">';
    foreach ($_POST as $key => $entry)
    {
        $HTML .= "$key: $entry<br/>";
    }
    $HTML .= '</div>';
    echo '<script type="text/javascript">$("#query-info").append("'.json_encode($HTML).'");</script>';
?>
于 2012-08-03T18:58:27.807 回答
1

您正在考虑 HTML，但代码是根据 DOM 运行的。 .append('<div class=\"well\">')将添加整个 div，而不仅仅是一串文本。您需要将内容添加为该 div 的子项。

var div = $('<div class=\"well\">').appendTo("#query-info");

//in the loop - add content to the div.well
div.append('". $key . ": " . $entry . "<br />');

您应该使用 PHP 编写 HTML 或 jQuery 来构建 DOM，但您可能不应该使用 PHP 编写 jQuery。

于 2012-08-03T18:59:55.497 回答
1

当您像这样调用该 jquery append 函数时，它会自动创建一个完整的节点，如您所见。在您的情况下，您可能想要做的是将所有 HTML 输出到 javascript 字符串变量，然后像这样附加它：

<?php
    $js_inner_html = '';
    foreach ($_POST as $key => $entry) {
        $js_inner_html .= $key . ': ' . $entry . '<br />';
    }
?>
<script type='text/javascript'>
    $('#query-info').append('<div class="well"><?php echo $js_inner_html; ?></div>');
</script>
于 2012-08-03T19:04:02.153 回答