JavaScript對象Literal「this」關鍵字jQuery回調參數傳遞

我在這裏做錯了什麼？我在這裏感到非常沮喪。當我調用Menu.mouseHandler時，我被卡住了，並且因爲它傳遞了一個參數，它似乎失去了它的價值？JavaScript對象Literal「this」關鍵字jQuery回調參數傳遞

var Menu = Menu || {}; 

Menu = { 
    docHeight: jQuery("document").height(), 
    menuOffset: jQuery("#menu").offset(), 
    index:0, 
    menuItem:"", 
    menuItemName:"", 
    menuItemPure:"", 
    killMenu: function() { 
     jQuery.each(['#menuApplyForCredit', '#menuBuyOrLease', '#menuVehicleProtection', '#menuCommercialFinancing', '#menuFinanceTools'], function() { 
      jQuery(menuItem).unbind("mouseenter mouseleave", function() { 
       console.log("NO CLICK! DO NOTHING~"); 
      }); 
     }); 
    }, 

    initialize: function() { 
     if (jQuery.browser.ios) { 
      jQuery.each(['#menuApplyForCredit', '#menuBuyOrLease', '#menuVehicleProtection', '#menuCommercialFinancing', '#menuFinanceTools'], this.touchHandler); 
     } else { 
      jQuery.each(['#menuApplyForCredit', '#menuBuyOrLease', '#menuVehicleProtection', '#menuCommercialFinancing', '#menuFinanceTools'], this.mouseHandler); 
     } 
    }, 

    touchHandler: function (i, v) { 
     var _that = this, 
     this.index = i; 
     this.menuItem = v; 
     this.menuItemPure = menuItem.replace('#menu', ''); 
     jQuery(menuItem).bind("touchstart touchend", _that.onTouch); 
    }, 

    mouseHandler: function (i, v) { 
     this.index = i; 
     this.menuItem = v; 
     console.log("mouseHandler: menuItem= "+this.menuItem); 
     this.menuItemName = jQuery(this.menuItem).find("a:first img").attr("src"); 
     this.menuItemPure = this.menuItem.replace('#menu', ''); 

     console.log("menuItemName=" + this.menuItemName); 
     console.log("menuItemPure=" + this.menuItemPure); 

     jQuery(this.menuItem).bind("mouseenter", Menu.onEnter); 
     //console.log(jQuery(this.menuItem).bind("mouseenter", Menu.onEnter)) 
     //jQuery(this.menuItem).bind("mouseenter", jQuery.proxy(Menu.onEnter, Menu)); 
     jQuery(this.menuItem).bind("mouseleave", jQuery.proxy(Menu.onLeave, Menu)); 
    }, 

    onEnter: function() { 
      console.log("CALLED!"); 
     //console.log("evt= "+this); 
     //console.log("this= "+this); 
     //console.log("onEnter menuItem= " + menuItem); 
     jQuery('#menu_overlay').clearQueue().stop().css({ 
      'display': 'block' 
     }).animate({ 
      opacity: '.3' 
     }, 200).height(this.docHeight); 
     //console.log("onEnter menuItemPure= "+ menuItemPure); 
     jQuery("#megaMenu" + menuItemPure + "Div").addClass("hovering"); 
     jQuery(menuItem).find("a:first").find("img").attr("src", "images/bttn" + menuItemPure + "Over.png").css({ 
      "z-index": "99" 
     }); 
    }, 

    onLeave: function() { 
     var _that = this; 
     console.log("onLeave= "+ menuItem); 
     var relX = Math.round(evt.pageX - this.menuOffset.left), 
      relY = evt.pageY - this.offsetTop; 
     if ((relX < 960 && relX > 0) && (relY < 41 && relY > 0)) { 
      jQuery("#megaMenu" + menuItemPure + "Div").removeClass("hovering"); 
      if (menuItemName.indexOf("Stay") > -1) { 
       jQuery(menuItem).find("a:first").find("img").attr("src", "images/bttn" + menuItemPure + "Stay.png").css({ 
        "z-index": "1" 
       }); 
      } else { 
       jQuery(menuItem).find("a:first").find("img").attr("src", "images/bttn" + menuItemPure + ".png").css({ 
        "z-index": "1" 
       }); 
      } 
     } else { 
      jQuery('#menu_overlay').css({ 
       'display': 'none' 
      }).animate({ 
       opacity: '0' 
      }, 100); 
      jQuery("#megaMenu" + menuItemPure + "Div").removeClass("hovering"); 
      if (menuItemName.indexOf("Stay") > -1) { 
       jQuery(menuItem).find("a:first").find("img").attr("src", "images/bttn" + menuItemPure + "Stay.png").css({ 
        "z-index": "1" 
       }); 
      } else { 
       jQuery(menuItem).find("a:first").find("img").attr("src", "images/bttn" + menuItemPure + ".png").css({ 
        "z-index": "1" 
       }); 
      } 
     } 
    }, 

    onTouch: function() { 
     jQuery('#menu_overlay').clearQueue().stop().hide().css({ 
      'display': 'block' 
     }).animate({ 
      opacity: '.3' 
     }, 200).height(this.docHeight); 
     jQuery("#megaMenu" + menuItemPure + "Div").removeClass("hovering").addClass("hovering"); 
     jQuery(menuItem).find("a:first").find("img").attr("src", "images/bttn" + menuItemPure + "Over.png").css({ 
      'z-index': '99' 
     }); 
    } 
} 

Menu.initialize();

來源

2012-02-04 SLB

錯字=此，'< - 。終止與分號。 – hyperslug 2012-02-04 22:55:47

通過在'mouseHandler'中分配'this'的屬性實際完成/試圖完成的是什麼？這些屬性只是在每次迭代/調用回調時重新分配。 – JMM 2012-02-04 23:05:29

是的，我看到了。活着的迭代/調用方法鏈。也許這是錯誤的方法，但我只是在努力。 – SLB 2012-02-04 23:21:14

與您的代碼，this應該是指你傳遞作爲第一個參數數組當前項目的值。如果你想this指Menu，嘗試：

jQuery.each(

    [ 

    '#menuApplyForCredit', 

    '#menuBuyOrLease', 

    '#menuVehicleProtection', 

    '#menuCommercialFinancing', 

    '#menuFinanceTools' 

    ], 

    jQuery.proxy(this.mouseHandler, this) 

);

見jQuery.each() docs。

在數組的情況下，每次回調都會傳遞一個數組索引和相應的數組值。（該值也可以通過this關鍵字

被訪問和看到的文檔的版本jQuery.proxy(function, context)的jQuery.proxy()下`touchHandler`，`變種_that

來源

2012-02-04 22:58:26 JMM

JavaScript對象Literal「this」關鍵字jQuery回調參數傳遞

回答

相關問題