Question

我正在使用Meteorjs作为我的应用程序。在这里，我陷入了一个问题。我有一个锚标记。我必须使用onmouseenter和click事件调用的函数。我所做的是如果锚标签上的用户click打开了一个引导框提示对话框来编辑锚标记的文本。如果用户'mouseenter`在锚标签上并在那里停留3秒钟，那么一个被调用的函数会显示一个bootstrap popover。我的问题是，如果我点击锚标签并保持三个弹出显示，它隐藏了在锚标记点击事件上打开的bootbox对话框。
我的代码是
在元素上输入鼠标时调用的函数。

'mouseenter .edit_name': function (evt, tgt) {
    timer = setTimeout( function() {
            var id=$(evt.currentTarget).data("pk");
            $("#edit_name_"+id).popover({title:"Objective" ,content:Objective})
            $("#edit_name_"+id).popover("show")
            }, 1500);
    }
    },

鼠标离开功能

'mouseleave .edit_name': function (evt, tgt) {
    $(evt.currentTarget).data("pk");
    $("#edit_name_"+id).popover("hide")
    clearTimeout(timer);
},

点击

时调用的功能

'click .edit_name': function (evt, tgt) {
    bootbox.prompt("Module Name",function(arg1,arg2){
}
},

但是当我点击元素并在那里停留3秒钟时，bootbox提示消失并显示popover。告诉我gus如果我点击元素，我怎么能停止显示popover。

编辑：
而不是bootbox.prompt，我尝试使用像这样的bootstrap.editable.js

$(".edit_name").editable({
    inputClass: 'input-large',
    url: function (params) {
        Meteor.call("renameItem", params.pk, params.value);

    }
});

但仍然是同样的问题。当弹出窗口显示时，它会隐藏.editable输入字段。

Answer 1

只需检查您的setTimeout功能中是否存在bootbox。如果存在bootbox，请不要运行popover代码。

"mouseenter .edit_name": function () {
  timer = setTimeout( function() {
    if ( !$(".bootbox").length ) {
      $(".edit_name").popover( { title: "Objective", content: Objective } );
      $(".edit_name").popover("show");
    }
  }, 1500);
}

onmouseenter和click功能无法一起使用

1 个答案: