Question

我的代码有问题。我想调用一个函数，但是不起作用。

首先，函数show（）显示按钮。此按钮的id ='send'，位于div中，类为'messagebox'。我想在按钮单击时调用功能。（我在php脚本中调用函数show）

echo<<<ENDL 

<div class="friendslistimgbox" onclick="show('$id','$login','$photo')">....</div>

ENDL;

$（。messagebox #send）或$（。messagebox> #send）无法正常工作

$(document).ready(function(){
    var conn = new WebSocket('ws://localhost:8080');
    conn.onopen = function(e) {
    console.log("Connection established!");
    };

    conn.onmessage = function(e) {
        console.log(e.data);
        var data = JSON.parse(e.data);
        var row = data.from+": "+data.msg+"<br/>";

        $("#chats").append(row);
    };

    $(".messagebox #send").click(function(){
        var userId = $("#userId").val();
        var msg = $("#msg").val();
        var data = {
            userId: userId,
            msg: msg
        };
        conn.send(JSON.stringify(data));
    })
})

function show(id,login,photo){      
    $('.messagebox').html("<input type='hidden' id='userId' value='"+login+"'><input type='text' id='msg' class='sendmessage'><button id='send' type='submit' class='button_sendmessage'><i class='icon-right-dir'></i></button>");
    $('#message_to').html("<a href='"+login+"'><img src='../userphotos/"+photo+"'>"+login+"</a>");
    $("#allmessagesbox").css("visibility","visible");
}

HTML /

<div class="allmessagesbox" id="allmessagesbox">
    <div class="messages">
        <div class="message_to" id="message_to"></div>
    </div>
    <div class="messagebox"></div>
</div>
<div id="chats"></div>

Answer 1

您需要使用.on()方法向动态DOM元素注册事件（例如，您的按钮，将来可能会出现）。

对于您的代码，您可以通过以下方式使用on()：

// Replace this line:
// $(".messagebox #send").click(function(){
// With this:
$("body").on("click", ".messagebox #send", function(){

    var userId = $("#userId").val();
    var msg = $("#msg").val();
    var data = {
        userId: userId,
        msg: msg
    };
    conn.send(JSON.stringify(data));
})

这基本上可以理解为：

// For any dynamic element in scope or child of the body
$("body")
// Register a click event with any element that matches the
// .messagebox #send selector either now, or in the future
.on("click", ".messagebox #send", function(){

...

}));

有关on()的更多信息，请参见jQuery documentation

无法调用jQuery函数

1 个答案: