jQuery重构了函数

jQuery refactored function

本文关键字:函数 重构 jQuery      更新时间:2023-09-26

我想让我的代码尽可能保持干燥,并想知道以下是否可行。我需要多次重用下面的代码,唯一的区别是我在下面的函数中做了什么。

.on("click", "a", function(e) {})

我可以复制addToBooking函数,给它一个不同的名称,对点击处理程序进行轻微的更改,但这感觉很浪费和重复。

我可以把一个代码块传给addToBooking函数吗?或者,也许还有另一种我不知道的酷而有效的方式。

完整的代码块

var addToBooking = function(that, event) {
  var left, top;
  event.stopPropagation(); 
  //Turn off all calendar tracking
  $(".track").off(); 
  //Get proper sticky positioning (Checks to make sure it wont display off screen)
  left = getPosition(".add_to_booking", "left");
  top = getPosition(".add_to_booking", "top");
  //Position sticky, display and listen for click event to see what to do next
  $(".add_to_booking").css({top: top, left: left})
                      .fadeIn('fast')
                      .on("click", function(e) { e.stopPropagation(); })
                      .on("click", "a", function(e) {
                        if($(this).text() === "YES") {
                          //Close dialog
                          closeTT();
                          //Open new add to booking box
                          addBooking(that, event);
                        } else {
                          closeTT();
                        }
                      });
}

传入函数并将其分配给

var addToBooking = function(that, event, custFnc) {
    ...
    ...
    .on("click", "a", custFnc );
}

Fiddle

要传递参数,需要使用call()

jQuery( function(){
    function hey(evt, test){ 
        var text = jQuery(this).text();
        alert(text + ":" + test);
    }

    function addClick( custFnc ){ 
        var test=99;
        jQuery("#foo").on("click", 
            function(e){ 
                custFnc.call(this, e,test); 
            } 
        );
    }
    addClick(hey);
});

​Fiddle