Question

请告诉我如何获取在面板上生成的行的点击事件。实际上，我能够获得在页面上生成的行事件。但是我使用了这个http://dbushell.com/2012/06/17/nestable-jquery-plugin/ 我想获得在面板中生成的行的单击事件。

我做了一个简单的演示，在面板中显示嵌套列表。要打开面板，标题“打开面板”上有一个按钮。

当您单击“添加测试用例按钮”时。在屏幕中也会生成行。当您单击任何一行时，它会打开新屏幕。还有另一个“添加测试用例”按钮。生成嵌套列表小组

http://jsfiddle.net/VRPMj/1/

我得到了像这样的页面上的行的点击事件。

$(document).on('click', '.clickTestCaseRow', function (e) {
    var clickId = this.id;
    hideDisplayView();
    displayNewView(clickId);
    alert('click')
    e.stopPropagation();
})

当我在面板列表上执行相同操作时，它不起作用。:(

Answer 1

所以这个

似乎有两个问题

首先，侧面板中的项目没有clickTestCaseRow类，因此$(document).on('click'..不会触发它们。

var menuid = "menu_" + id;
    $('#testSuit').append('<li class="dd-item submenu_h" id="' + menuid + '" ><div class="clickTestCaseRow dd-handle" id="' + menuid + '">' + id + '</div></li>')

其次，似乎嵌套列表插件会阻止其项目上的mousedown事件。因此，我已禁用嵌套列表进行检查，现在可以正常运行。没有可嵌套的拖动功能：

http://jsfiddle.net/VRPMj/3/

要真正解决问题，您必须摆弄可嵌套插件本身。我已快速浏览了一下，问题似乎就在104号线上。这可以防止项目上的mousedown事件。所以这是一个起点。

    var onStartEvent = function(e)
        {
            var handle = $(e.target);
            if (!handle.hasClass(list.options.handleClass)) {
                if (handle.closest('.' + list.options.noDragClass).length) {
                    return;
                }
                handle = handle.closest('.' + list.options.handleClass);
            }
            if (!handle.length || list.dragEl || (!hasTouch && e.button !== 0) || (hasTouch && e.touches.length !== 1)) {
                return;
            }
            e.preventDefault(); // <=== Here
            list.dragStart(hasTouch ? e.touches[0] : e);
        };

如何获取面板上生成的行的单击事件？

1 个答案: