javascript 聊天客户端的发送按钮不起作用

c8ib6hqw  于 2023-01-19  发布在  Java
关注(0)|答案(1)|浏览(123)

我正试图得到一个聊天系统的实现,我不太清楚是什么问题,这就是为什么我把我的代码在这里审查。我怀疑可能有一个问题,我的javascript代码。更新:1:21 AM EST 01/19/2023我将ID更改为发送,但按钮仍然不起作用。它不传输消息。没有数据被发送到名为market的数据库中的messages表以下是数据库和聊天框https://ibb.co/8DVLBfNhttps://ibb.co/WWcx5xC的一些图片
我还创建了一个realTimeChat页面,代码如下。
realTimeChat.php

<?
    include("DBConnection.php");
    $FromUser = $_POST["FromUser"];
    $ToUser = $_POST["ToUser"];
    $output="";
    $chats = mysqli_query($connect, "SELECT * FROM messages where (FromUser = `".$FromUser."` AND ToUser = `".$Touser."`) 
    OR (FromUser = `".$ToUser."` AND Touser = `".$FromUser."`) ") or die ("Failed to query database".mysqli_error());
    while($chat = mysqli_fetch_assoc($chats))
    {
        if($chat["FromUser"] == $_SESSION["userID"])
        $output .= "<div style=`text-align:right;`>
        <p style=`background-color:lightblue: word-wrap:break-wordl display:inline-block; padding:5px; border-radius:10px; max width:70%;`>
        ".$chat["Message"]."
        </p>
        </div>";
        else $output.="<div style=`text-align:left;`>
        <p style=`background-color:yellow; word-wrap:break-word; display:inline-block; padding:5px border-radius:10px;
        max width: 70%;`>
        ".$chat["Message"]."
        </p>
        </div";
    }
    
    echo $output;
    
    
    ?>

chat-index-page.php

`<?php
session_start();
include("DBConnection.php");
include("links.php");
$connect = mysqli_connect("localhost", "root", "", "market");
if(isset($_GET["userId"]))
{
    $_SESSION["userId"] = $_GET["userId"];
    header("location: chatbox.php");
}
?>

<!DOCTYPE html>
<head>
    <title>

    </title>
</head>
<body>
    <div class="container" style="
    
    border: none;
    height: 800px;
    width: 800px;
    display: flex;
    justify-content: center;
    background: #fff;
    border-radius: 5px;
    box-shadow: 0 0 15px rgb(0 0 0 / 20%);
    padding-top: 30px;
    margin-left: 500px;
    
    ">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <h4>Please Select Your Account</h4>
               </div>
               <div class="modal-body">
                <ol></ol>
                <?php
                $users = mysqli_query($connect, "SELECT * FROM users") or die ("Failed to query database".mysqli_error($mysql));
                while($user = mysqli_fetch_assoc($users))
                {
                    echo '<li style="list-style:none;"><a href="chat-index-page.php?userId='.$user["Id"].'">'.$user["User"].'</a></li> ';
                }
                
                ?>
                </ol>
                <a href="registerUser.php" style="float:right;">Register here.</a>
               </div>
            </div>
        </div>
    </div>
</body>
</html>`

chatbox.php

<?php

`session_start();
include("DBConnection.php");
include("links.php");
$connect = mysqli_connect("localhost", "root", "", "market");
$users = mysqli_query($connect, "SELECT * FROM users WHERE Id = '" . $_SESSION["userId"] . "'")
    or die("Failed to query database" . mysqli_error($mysql));

while ($user = mysqli_fetch_assoc($users)) {
    $_SESSION["Id"] = $user["Id"];
    $_SESSION["User"] = $user["User"];
}
?>
<!DOCTYPE html>
<html>

<head>
    <link rel="stylesheet" href="style.css" />
    <link rel="stylesheet" href="password-strength-indicator.css">
    <title>Messages</title>
</head>

<body>
    <div class="container-fluid">
        <div class="row">
            <div class="col-md-4">
                <p>Hi, <?php echo $_SESSION["User"]; ?></p>
               
                <p>Send message to:</p>
                <ul style="list-style-type: none;">
                    <?php
                    $msgs = mysqli_query($connect, "SELECT * FROM users")
                        or die("Failed to query database" . mysqli_error($mysql));
                    while ($msg = mysqli_fetch_assoc($msgs)) {
                        echo '<li><a href="?ToUser=' . $msg["Id"] . '">' . $msg["User"] . '</a></li>';
                    }
                    ?>
                </ul>
                <a href="chat-index-page.php"><-- Back</a>
            </div>
            <div class="col-md-4">
                <div class="modal-dialog">
                    <div class="modal-content">
                        <div class="modal-header">
                            <h4><?php
                                if (isset($_GET["toUser"])) {
                                    $userName = mysqli_query($connect, "SELECT * FROM users Id = '" . $_GET["toUser"] . "' ")
                                        or die("Failed to query database" . mysqli_error($connect));
                                    $uName = mysqli_fetch_assoc($userName);
                                    echo '<input type="text" value=' . $_GET["toUser"] . ' id="toUser" hidden />';
                                    echo $uName["User"];
                                } else {
                                    $userName = mysqli_query($connect, "SELECT * FROM users")
                                        or die("Failed to query database" . mysqli_error($connect));
                                    $uName = mysqli_fetch_assoc($userName);
                                    $_SESSION["toUser"] = $uName["Id"];
                                    echo '<input type="text" value=' . $_SESSION["toUser"] . ' id="toUser" hidden />';
                                    echo $uName["User"];
                                }
                                ?></h4>
                        </div>
                        <div class="modal-body" id="msgBody" style="height:400px; overflow-y: scroll; overflow-x: hidden;">
                            <?php
                            if (isset($_GET["toUser"])) {
                                $chats = mysqli_query($connect, "SELECT * FROM messages where (FromUser = '".$_SESSION["userId"]."' AND
                                 ToUser = '".$_GET["toUser"]."') OR (FromUser = '".$_GET["userId"]."' AND
                                 ToUser = '".$_SESSION["userId"]."')")
                                or die("Failed to query database". mysqli_error($connect));
                                $chat = mysqli_fetch_assoc($chats);
                            }
                            else {
                                $chats = mysqli_query($connect, "SELECT * FROM messages where (FromUser = '".$_SESSION["userId"]."' AND
                                ToUser = '".$_SESSION["toUser"]."') OR (FromUser = '".$_SESSION["userId"]."' AND
                                ToUser = '".$_SESSION["userId"]."')")
                               or die("Failed to query database". mysqli_error($connect));

                               while($chat = mysqli_fetch_assoc($chats)) {
                                 if($chat["FromUser"] == $_SESSION["userId"]) {
                                    echo "
                                    <div style='text-align:right;'>
                                        <p style='background-color: lightblue; word-wrap:break-word; display:inline-block;
                                        padding:5px; border-radius:10px; max width: 70%;'>
                                        ".$chat["Message"]."
                                        </p>
                                    </div>";
                                 } else {
                                    echo "
                                    <div style='text-align:left;'>
                                        <p style='background-color: yellow; word-wrap:break-word; display:inline-block;
                                    padding:5px; border-radius:10px; max-width: 70%;'>
                                    ".$chat["Message"]."
                                    </p>
                                    </div>";
                                 }

                               };
                            }
                            ?>
                        </div>
                            <div class="modal-footer"style="position:absolute">
                            <textarea id="message" class="form-control" style="
                            height: 250px;
                            width: 500px;
                            position: absolute;
                            margin-top: -390px;
                            margin-left: -110px;"></textarea>
                            <button id="reg_btn" class="btn btn-primary" style="
                            position: absolute;
                            width: 100px;
                            top: -140px;
                            left: 286px;">Send</button>
                        </div>
                    </div>
                </div>
            </div>
            </div>
    </div>
</body>
<script type="text/javascript">
    $(document).ready(function(){

        $("#send").on("click",function(){
            $.ajax({
                url:"insertMessage.php",
                method:"POST",
                data:{
                    FromUser: $("#FromUser").val(),
                    ToUser: $("#ToUser").val(),
                    message: $("#message").val()
                },
                dataType:"text",
                success:function(data)
                {
                    $("#message").val("");
                }
            });
        });
    });
    
    </script>
    </body>
</html>`

insertMessage.php

`<?php
session_start();
include("DBConnection.php");
$FromUser = $_POST["FromUser"];
$ToUser = $_POST["ToUser"];
$Message = $_POST["Message"];
$output="";
$sql = "INSERT INTO messages (FromUser, ToUser, Message) VALUES ('$FromUser','$ToUser', '$message')";
if($connect -> query($sql))
{
    $output.="";
}
else 
{
    $output.="Error. Please Try Again.";
}
echo $output;
?>`

我试着检查代码看是否有语法错误,但似乎没有。当点击发送按钮时,它应该发送消息,但没有发生任何事情。发送按钮由于某种原因不工作。

xuo3flqw

xuo3flqw1#

中的发送按钮元素ID为“reg-btn”<chatbox.php>,但您要向ID为“send”的元素添加侦听器。
将按钮ID更改为“发送”。

相关问题