JQuery单击事件目标/按钮打开两个对话框

时间:2012-02-29 08:39:35

标签: jquery jquery-click-event

我正在使用asp.net webGrid,其中我有两个按钮,它们都打开相同的对话框(具有不同的内容)和一个对话框,只有当点击当前行时才打开(不是从按钮点击)。我有这个if if else检查点击的元素是否是一个按钮。

问题是这在加载页面后第一次正常工作。如果我只点击按钮,它会打开正确的对话框。但是,在第一次单击一行后,按钮单击立即打开两个对话框。

这是代码,

$('#grid').click(function(e){
    if($(e.target).is(':button'))
    {
        $('.edit-db').live('click', function () {
            $.getJSON('/Methods/dbQuery/' + $(this).attr('id'), function (data) {
                var lista = data;
                $('#edit-id').val(lista.id);
                $('#edit-nimi').val(lista.nimi);
                $('#edit-ip').val(lista.ip);
            });
            $('#action-type').val('edit');
            tyyppi = 'edit';
            $("#edit").show();
            $("#delete").hide();
            $('#dialog-edit').dialog('open');
        });

        $('.delete-row').live('click', function () {
            $.getJSON('/Methods/dbQuery/' + $(this).attr('id'), function (data) {
                var lista = data;
                $('#edit-id').val(lista.id);
            });
            $('#action-type').val('delete');
            $("#edit").hide();
            $("#delete").show();
            $('#dialog-edit').dialog('open');
        });
    }
    else
    {
        $('tbody tr').live('hover', function () {
            id = $(this).find('td:first').text();
            $(this).toggleClass('clickable');
        }).live('click', function () {
            $("#devInfo").load("deviceInfo.cshtml/" + id).dialog('open');
        });
    }
});

1 个答案:

答案 0 :(得分:0)

您不需要围绕live()方法调用的点击处理程序。因为你有一个,所以每次点击后都会在这些元素上重复设置live()

is(':button')检查是多余的,因为tr元素永远不会是按钮。

此外,live()已被弃用。如果您使用的是jQuery 1.7+,则应使用on(),否则应使用delegate()

试试这个:

$('#grid').delegate('.edit-db', 'click', function (e) {
    e.stopPropagation();
    $.getJSON('/Methods/dbQuery/' + $(this).attr('id'), function (data) {
        var lista = data;
        $('#edit-id').val(lista.id);
        $('#edit-nimi').val(lista.nimi);
        $('#edit-ip').val(lista.ip);
    });
    $('#action-type').val('edit');
    tyyppi = 'edit';
    $("#edit").show();
    $("#delete").hide();
    $('#dialog-edit').dialog('open');
});
.delegate('.delete-row', 'click', function (e) {
    e.stopPropagation();
    $.getJSON('/Methods/dbQuery/' + $(this).attr('id'), function (data) {
        var lista = data;
        $('#edit-id').val(lista.id);
    });
    $('#action-type').val('delete');
    $("#edit").hide();
    $("#delete").show();
    $('#dialog-edit').dialog('open');
});
.delegate('tbody tr', 'hover', function () {
    id = $(this).find('td:first').text();
    $(this).toggleClass('clickable');
})
.delegate('tbody tr', 'click', function () {
    $("#devInfo").load("deviceInfo.cshtml/" + id).dialog('open');
});