单击按钮的类中的回显数据答案

【问题标题】：Echo data in class in which button was clicked单击按钮的类中的回显数据
【发布时间】：2011-12-16 18:39:43
【问题描述】：

这是一个 ajax 函数，我想在单击特定类中的按钮时执行，许多相同的类是从 php 中的 while 循环生成的，但是我希望仅在类中输出数据按钮被点击，而不是其他类，尽管它们具有相同的名称。

我还需要更改 ajax 函数，因为“status”是一个类而不是 id，而函数调用 ID 为“status”而不是类“status”的元素，一个

<script>
    function ajax_posta() {
// Create our XMLHttpRequest object
        var hr = new XMLHttpRequest();
// Create some variables we need to send to our PHP file
        var url = "javas.php";


        hr.open("POST", url, true);
// Set content type header information for sending url encoded variables in the request
        hr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
// Access the onreadystatechange event for the XMLHttpRequest object
        hr.onreadystatechange = function () {
            if (hr.readyState == 4 && hr.status == 200) {
                var return_data = hr.responseText;
                document.getElementById('status').innerHTML = return_data;
            }
        }
// Send the data to PHP now... and wait for response to update the status div
        hr.send("num=" + (--num)); // Actually execute the request
        document.getElementById('status').innerHTML = "<img src = 'loading.gif' height = '30'     width = '30'>";

    }
    $(document).ready(function()
    {
        $('.eventer.button').click(function () {
            var self = this;
            $.post('javas.php', function (data) {
                $(self).parent('div').find('.status').html(data);
            })
        });
    }
    )
    ;
</script>

while 循环中的 PHP 代码会生成多个具有相同名称的类和按钮的副本。

echo " <div class = 'eventer'> $timeposted <br>$eventlist <input name='myBtn'     type='submit' value='increment' onClick='javascript:ajax_post();'>
<input name='lol' type='submit' value='dec' onClick='javascript:ajax_posta();'></div>
<div class = 'status'></div>";
echo "<br>";

到目前为止我所拥有的似乎不起作用，感谢任何帮助，谢谢！

【问题讨论】：

也许你重命名了status id/classes 之一，因为它不仅阅读起来令人困惑，而且可能会给你调试提示
ajax_posta() 与可能只是一个问题发布过程。
另外，我看到您已经在使用 jQuery。为什么不使用 $.ajax？ api.jquery.com/jQuery.ajax

标签： jquery html css ajax class

【解决方案1】：

试试这个：

    $('.eventer > .button').click(function () {
        var self = this;
        $.post('javas.php', function (data) {
            $(self).closest('.eventer').find('.status').html(data);
        })
    });

然后将 ajaxposta() 转换为 jQuery。 =D

可能是这样的：

function ajax_post() {  
    $.ajax({
        type: "POST",
        url: "javas.php",
        data: "num=" + (--num),
        success: function(result){
        $('#status').html(result);
    });
    $('#status').html("<img src=\"loading.gif\" style=\"height:30px; width:30px;\">");
}

【讨论】：