单击 qtip 中的按钮时获取上下文 jquery

Question

这是一个通用问题。我有以下代码，其中 #datatable 是（你猜对了）一个 datatable

$("#datatable").on(
    "mouseenter",
    "td",
    function(event) {
        $(this).qtip(
            {
                content:"<button>Test</button>",
                position: {
                    my: 'bottom left',
                    at: 'center right',
                    adjust : {
                        method: "shift"
                    },
                    viewport: $('#datatable')
                },
                show: {
                    event: event.type,
                    ready: true
                },
                hide: {
                    fixed: true
                }
            },
            event
        );
    }
);

当我在 qTip2 工具提示中单击我的按钮时，我希望能够使用 $(this) 的所有优点（例如获取列名 and/or 的值细胞）。

jsFiddle here ：当您单击 Test 按钮时，如何显示带有列名称的警报？

Answer 1

您可以在工具提示呈现后访问它 - Documentation Link

    events: {
        render: function(event, api) {
                // console.log( api ); // to see the full list
            console.log( api.target[0].innerText ); // return the text of the cell
        }
    }

Fiddle

Answer 2

您可以给按钮一个 class 并在呈现工具提示后触发点击。
不需要 this-关键字：

content:"<button class='my-btn'>Test</button>",
/*...*/
events: {
    render: function(e, api){
        $(".my-btn").on("click", function(){ 
            alert(api.target[0].innerText); 
        });
    }
}

Live Demo

单击 qtip 中的按钮时获取上下文 jquery

Get the context when clicking a button in a qtip jquery

javascript

jquery

datatables

qtip2