jQuery post 上什么也没发生答案

【问题标题】：Nothing happening on jQuery postjQuery post 上什么也没发生
【发布时间】：2012-03-14 02:18:31
【问题描述】：

下面是我的 jQuery 函数，用于将姓名、密码和电子邮件的值发布到 register.php，然后在register.php indiv#message 中显示一条回显的消息。

但是，当我单击 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 时似乎没有发生任何事情。

<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>

【问题讨论】：

当我抛出一个 jsFiddle 时工作。您是否还有其他可能与上述冲突的代码？
您的代码看起来不错 - 假设您使用的是 jQuery 1.7+ 并且可以访问 on()。点击#btnPost之前控制台是否有错误？
您可能需要处理 HTML 格式...只是为了保持一致性和可读性。不同的“/”，= 符号周围的不同空格等等......另外，为什么不把它做成一个 HTML 表单，以便在禁用 js 时它可以工作？
另外，你测试的是什么浏览器？
请链接到 js fiddle，我不想把它做成一个表单，因为点击按钮后整个页面会刷新

标签： jquery html css ajax post

【解决方案1】：

我使用相同的语法遇到了类似的问题，我按照以下几行重新设计了我的问题，它解决了这个问题....

尝试：

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

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

【讨论】：

jsfiddle.net/bUsBN/3 - 事件触发，我在屏幕上写了一些东西。如果中间出现问题，那么它可能无法正常工作。

【解决方案2】：

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

【讨论】：

【解决方案3】：

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

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

【讨论】：