JQuery UI：无法获取事件的目标元素

Question

我使用slickgrid。一列(第一列(包含一个链接。现在，当将鼠标悬停在链接上(在jquery中为mouseenter(时，将显示一个jquery u界面对话框，其中包含单击链接时可见的一些数据。通常，这将防止用户必须单击链接。

因为用户可以动态地向网格添加行，所以我使用 on(( 来绑定事件

$("#grid").on({
    mouseenter: function () {
        //here I get the correct element but have to store it in global var
        myNumber = $(this).text(); 
        $( "#dialog-char" ).dialog("open");
    },
    mouseleave: function () {
        $( "#dialog-char" ).dialog( "close" );
    }
},
    ".char-link"
);

我想将myNumber传递给对话框打开功能：

$( "#dialog-char" ).dialog({
    resizable: true,
    width: 750,
    autoOpen: false,
    open: function( event, ui ) {
        loadChar(myNumber);
    }
});

像这样它有效，但我再次需要全局变量。如何访问 open(( 函数中的链接？ event.target不是链接，而是包含网格的div。其他目标属性都返回未定义。

这可能吗？

Answer 1

好吧，

看起来没有直接的方法。如果要避免全局变量，可以在打开之前将有关悬停链接的信息绑定到#dialog-char，使用方法如下data()：

$("#grid").on({
  mouseenter: function () {
    $( "#dialog-char" ).data('myNumber',$(this).text()); 
    $( "#dialog-char" ).dialog("open");
  },
  mouseleave: function () {
    $( "#dialog-char" ).dialog( "close" );
  }
},
".char-link"
);
$( "#dialog-char" ).dialog({
 resizable: true,
 width: 750,
 autoOpen: false,
 open: function( event, ui ) {
    myNumber= $(this).data('myNumber');
 }
});