Javascript函數顯示“未捕獲的參考錯誤”

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，那么您編寫的Als會更好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);