Question

我想通过click或hover传递一个变量来导致此方法。

现在，它默认为点击。

    var defaults = {    
        xOffset: 10,        
        yOffset: 25,
        tooltipId: "easyTooltip",
        clickRemove: true,
        content: "",
        useElement: "",
        clickAppear: true
    }; 

    var options = $.extend(defaults, options);  
    var content;

$(this).click(function(e){
    $("#" + options.tooltipId).remove();                                                               
    content = (options.content != "") ? options.content : title;
    content = (options.useElement != "") ? $("#" + options.useElement).html() : content;
    $(this).attr("title","");                                                   
    if (content != "" && content != undefined){         
        $("body").append("<div id='"+ options.tooltipId +"'>"+ content +"</div>");      
        $("#" + options.tooltipId)
            .css("position","absolute")
            .css("top",(e.pageY - options.yOffset) + "px")
            .css("left",(e.pageX + options.xOffset) + "px")                     
            .css("display","none")
            .fadeIn("fast");
    return false;
    }
},

我希望它能够传递clickAppear = false的方法调用，在这种情况下它会产生这个：

$(this).hover(function(e){
  ...

我没有在条件中复制和粘贴整个方法两次（这似乎不起作用），我想知道是否有一种优雅的方法来编写这个条件，同时保持块DRY。

有什么想法吗？

Answer 1

嗯，你可以写：

$(this)[options.clickAppear ? "click" : "hover"](function(e) {
  // your code
});

只需检查选项并选择“点击”或“悬停”功能，然后调用它。

Answer 2

您应该将处理程序函数声明为变量：

var myFunc = function(e){ // your handling code here
};

然后在你的函数上将处理程序附加到你输入条件的事件：

if(options.clickAppear)
   $(elem).click(myFunc);
else
   $(elem).hover(myFunc);

Answer 3

只需使用命名函数：

function doStuff() {
  ..
}

$(this).click(doStuff);
$(this).hover(doStuff);

Answer 4

正如评论中所指出的，这可能无法正常工作，因为this的第一个实例没有上下文 - 因此未定义。但这是一般的想法：

$(this).click(function(e){
    // your method
}).hover(function(e){
    $(this).trigger('click');
});

插入此条件语句的最优雅方式是什么？

4 个答案: