jQuery帖子没有任何反应

Question

以下是我的jQuery函数，用于将名称，密码和电子邮件的值发布到register.php ，然后在div#message显示register.php中回显的div#message 。

但是，当我单击postBtn什么也没有发生，并且控制台postBtn日志。

jQuery的

$(document).ready(function() {
    $("#btnPost").on("click", function() {
        console.log('clicked'); 
        var thisBtn = $(this); 
        var parent = thisBtn.parent(); 

        name = parent.data('name'); 
        password = parent.data('password'); 
        email = parent.data('email');

        $.post(
            'register.php', 
            { 
                name: ('name'), 
                password: ('password'), 
                email: ('email')
            },          
            function(data) {
                parent.next('#message').html(data);
            }
        );
    });
});

这是输入所有数据的HTML块，但是单击按钮#postBtn似乎没有任何#postBtn 。

<table>
    <tr>
        <td> Username: <td>
        <td> <input type = "text"  class = "field" name = "name"> </td>
    </tr>
    <tr>
        <td> Password: <td>
        <td> <input type = "password" class = "field" name = "password"> </td>
    </tr>
        <td > Email: <td>
        <td> <input type = "email" class = "field" name = "email"> </td>
    </tr>
    <tr>
        <td>  <td>
        <td> <button  class='regular' id = "btnPost" name='save'> Log In  </button></td>
    </tr>
    <tr>
</table>

Answer 1

我使用相同的语法遇到了类似的问题，我按照以下内容对我的代码进行了重新设计，从而解决了该问题。

尝试：

$(document).on("click", "#btnPost", function() { //implementation });

您可以将$(document)更改$(document)包含div的名称，或将其更改$(document)较低级别的名称，只要#btnPost包含#btnPost 。

Answer 2

检查包含在源代码（HTML）中的jQuery库文件的顺序。 首先是jQuery库文件，然后是您的javascript文件。 看来您的代码在jsfiddle中工作正常。 原因之一可能是jQuery文件不存在或加载顺序不匹配。

Answer 3

您的问题是使用.next() ，它返回当前元素的下一个同级。 并且由于您要传递选择器，因此只有下一个兄弟姐妹满足选择器时，您才会获得结果，否则您将一无所获。 只需使用$("#message")因为#message并不是按钮的父元素之后的下一个同级对象。

$.post( 
    'register.php',  
    {  
        name: ('name'),  
        password: ('password'),  
        email: ('email') 
    },           
    function(data) { 
        $('#message').html(data); 
    } 
);