Question

这是一个将自身连接到MySQL数据库的PHP代码。该交易是，它显示存储在数据库中的名称列表。我需要做的是，点击时，名称应显示自己的聊天框（与Facebook中的相同）。

这里的问题在于标有箭头的线。单击特定名称时，它应调用函数display_chat_box，但不会。它工作得很好，直到我没有在其中添加studentid参数。我怀疑函数chat_box_number()是作为参数发送的，但它确实没有帮助我。它之前工作得很好，为什么现在不行呢？我在Google Chrome中打开了开发者工具来检查错误，然后显示

**未捕获的ReferenceError：display_chat_box()未定义**。

我不明白为什么？还有其他人吗？无论问题存在，任何人都可以发布一个有效的解决方案，这样我就可以将聊天盒恢复生机。

<?php
$con = mysql_connect("localhost", "****", "******");
mysql_select_db("my_db", $con);
$result = mysql_query("SELECT * FROM online_students");
while ($row = mysql_fetch_array($result)) {
    $result2 = mysql_query("SELECT * FROM students WHERE email='$row[email]'");
    $row2 = mysql_fetch_array($result2);
    $name = $row2['firstname'] . " " . $row2['lastname'];
    $studentid = $row2['studentid'];
    echo "<li onclick='display_chat_box(chat_box_number(),\"" . $name . "\"," . $studentid . ")'>" . $name . "</li>";
}
mysql_close($con);
?>

<script src="jquery-1.9.1.min.js" type="text/javascript">
    var n = 0, chat_wid;
    function chat_box_number() {
        if (n == 2)
            n = 0;
        n++;
        return n;
    }

    function display_chat_box(j, name, studentid) {
        alert("hi");
        switch (j) {
            case 1: {

                document.getElementsByClassName("chat_box1")[0].style.display = "block";
                document.getElementById("chat_with1").innerHTML = name;
                break;
            }
            case 2: {
                document.getElementsByClassName("chat_box2")[0].style.display = "block";
                document.getElementById("chat_with2").innerHTML = name;
                break;
            }
            case 3: {
                document.getElementsByClassName("chat_box3")[0].style.display = "block";
                document.getElementById("chat_with3").innerHTML = name;
                break;
            }
        }
        chat_wid = studentid;
        update_chat();
    }
</script>

Answer 1

你需要：

<script src="jquery-1.9.1.min.js" type="text/javascript"></script>
<script type="text/javascript">
// your JS code
</script>

如果您使用不显眼的js，那么您的代码会更好IMO，即以编程方式将click处理程序附加到documentready而不是html属性，因此您的li可能如下所示：

echo "<li class=\"display-chat-box-action\" data-name=\"$name\" data-studentid=\"$studentid\">$name</li>";

你可能在JS中有这个

$(function () {
   $('li.display-chat-box-action').on('click.chatBoxDisplay', function () {
        var $this = $(this),
            name = $this.attr('data-name'),
            studentid = $this.attr('data-studentid');

        display_chat_box(chat_box_number(), name, studentid);
   });
});

Answer 2

未定义引用的问题是因为你错过了

<script>

标签将其放在

之后

<script src="jquery-1.9.1.min.js" type="text/javascript">.

提示：如果使用自己的方法选择元素，为什么要使用jQuery lib。我举一个简单的例子

代替

document.getElementsByClassName("chat_box1")[0].style.display="block";

使用

$(".class")[n].css("display","block");

代替

document.getElementById("chat_with3").innerHTML=name;

使用

$("#id").html(name);

Javascript函数显示“未捕获的参考错误”

2 个答案: