Question

我有一些运行困难的jQuery代码，因为我正在使用动态创建的表（从MySQL表中获取变量）。我想在 msg div中显示相应的PHP变量 $ row ['name'] 。所以它会说：

    $("#msg").text($("<?php echo $row['name']; ?> has been booked.");

顺便说一下，我不确定这是不是正确的方式。

不幸的是，当用户点击 button3 时，它只会更新第一个 msg div并忽略其余部分。有没有办法让我动态链接jQuery实例和生成的PHP代码，以便它可以更新正确的 msg div并在之后显示正确的消息。

jQuery代码在我的文档的头部，PHP代码在正文中。

jQuery代码

<!-- alert -->

<script type="text/javascript">
 $(".button3").click(function() {
    $(this).parent().slideUp("slow", function () {
        $("#msg").text($("button",this).text() + " has been booked.");
        });
    })
</script>

动态创建表：

if($res->numRows() > 0)
{
    echo "<table class='zebra'>
    <tr>
    <th scope='col'>Name</th>
    <th scope='col'>Capacity</th>
    </tr>";
    while($row = $res->fetchRow())
    {
        echo '<tr align="left">';
        echo "<td>{$row['name']}</td>";
        echo "<td>{$row['capacity']}</td>";

        <div>
        <input type='image' class='button3' src='resources/book.png'
        style='padding-top: 15px;'/>
        </div>

        <div id='msg'>
        </div>
        </td>";     
    }

Answer 1

<div id='msg'>

这不应该是一个循环。如果有多个HTML元素具有相同的id，那么我认为选择它们的jQuery响应将是未定义的并且是特定于浏览器的。最好使用这样的东西：

<div class='msg'>

然后选择它：

$("div.msg")

另外值得注意的是，你似乎在这一行上有一个拼写错误：

$("#msg").text($(">?php echo $row['name']; ?> has been booked.");

PHP代码的左括号反转。此外，这里的事件顺序是什么？您需要确保不要尝试将PHP代码动态添加到客户端页面。那不行。如果您的JavaScript代码需要从PHP代码获取信息，则需要联系服务器资源（最有可能是调用.ajax()或类似函数，其中服务器端资源接受参数并呈现信息，可能作为JSON对象）。

Answer 2

我没有测试过，但我希望它会对你有所帮助。我要去jsFiddle检查一下。

Here it is.我不得不在HTML中改变很多东西，我不确定它是不是你想要的？

对于懒惰的问题，我会在包含该名称的单元格中添加一个类（这样您就不必担心单元格的顺序）

    echo "<td class="name">{$row['name']}</td>

然后，您只需将onclick功能替换为：

<script type="text/javascript">  $(".button3").click(function() {
    var clickedButton = $(this);
    $(this).parent().slideUp("slow", function () {
        $("#msg").text(clickedButton.parent().parent().find('.name').text() + " has been booked.");
        });
    }) </script>

在MySQL表的上下文中使用jQuery

2 个答案: