0

为什么只触发第一个按钮 onclick ?当我单击其他 2 个人时,它们不会触发任何事件,我的控制台中也没有错误:

<script>
$(document).ready(function(){

             var name_of_sender ="";
             var text_of_sender ="";

             var $dialog = $('<div></div>')
            .html('This dialog will show every time!')
            .dialog({
                autoOpen: false,
                title: 'Basic Dialog'
            });



            $("#edit_text").click(function() {

                var butName = $(this).attr("name");
                var user_id = butName.split("_")[1];
                alert(user_id);
                name_of_sender = $('#username_'+user_id).html();
                text_of_sender = $('#text_'+user_id).html();

                alert(name_of_sender);
                alert(text_of_sender);

                $dialog.dialog('open');
                // prevent the default action, e.g., following a link
                return false;
            });
});
</script>
<table>
<tbody>
<tr>
    <td id="username_33">test</td>
    <td id="text_33">asdasdasd</td>
    <td>2012-09-27</td>
    <td>217.xx.xx.6</td>
    <td>
    <button id="edit_text" name="id_33">Edit</button>
    </td>
</tr>
<tr>
    <td id="username_34">test</td>
    <td id="text_34">asdasdasd</td>
    <td>2012-09-27</td>
    <td>217.xx.xx.6</td>
    <td>
    <button id="edit_text" name="id_34">Edit</button>
    </td>
</tr>
<tr>
    <td id="username_35">test</td>
    <td id="text_34">asdasdasd</td>
    <td>2012-09-27</td>
    <td>217.xx.xx.6</td>
    <td>
    <button id="edit_text" name="id_35">Edit</button>
    </td>
</tr>
</tbody>
</table>
4

3 回答 3

6

ID 应该是唯一的。使用 ID 选择器 - 它只会选择使用该 ID 找到的第一个元素 - 因此事件处理程序仅绑定到第一个按钮 对于您的代码,您可以将其更改为

$("button[name^=id_]").click(function() {

或将您的 id 更改为 class 并使用 class selector

于 2012-09-27T16:54:55.060 回答
1

您应该有元素的唯一 ID,您可以使用带有通配符的名称来绑定单击与所有按钮

    $("input[type=button][id^=id_").click(function() {

            var butName = $(this).attr("name");
            var user_id = butName.split("_")[1];
            alert(user_id);
            name_of_sender = $('#username_'+user_id).html();
            text_of_sender = $('#text_'+user_id).html();

            alert(name_of_sender);
            alert(text_of_sender);

            $dialog.dialog('open');
            // prevent the default action, e.g., following a link
            return false;
        });
于 2012-09-27T16:57:37.617 回答
0

好的,上面的例子似乎对某些人有用,但对我没有用。

这样,名为 Edit 的按钮的工作原理是一样的:

$('#Edit').live('click', function () {

});
于 2012-10-30T14:27:45.947 回答