覆盖$ .mobile中的JQuery Mobile方法的正确方法

问题描述:

当软键盘启动时,我正在使用的JQuery Mobile应用趋向于崩溃.我已经实现了一个解决方案,并且效果很好,但是我必须直接编辑jquery.mobile-1.2.0.js来实现.我宁愿将更改保存在jquery.mobile.customizations.js文件中,该文件扩展了jQuery Mobile.

The JQuery Mobile app I'm working on tends to freak out when the soft keyboard launches. I've implemented a solution and it works great, but I had to edit jquery.mobile-1.2.0.js directly to do it. I'd much rather keep my changes in a jquery.mobile.customizations.js file, which extends jQuery Mobile.

我尝试执行以下操作均未成功:

I tried to do the following with no success:

delete $.mobile.getScreenHeight;
$.mobile.last_width = null;
$.mobile.last_height = null;
$.mobile.getScreenHeight = function() 
{
   // My modified version
}

我在我的$.mobile.getScreenHeight中添加了警报语句,以及原始的$.mobile.getScreenHeight.我的确看到了自定义方法的警报被触发,但有时也会在原始函数中触发该警报.

I added alert statements into my $.mobile.getScreenHeight, plus the original $.mobile.getScreenHeight. I did see my custom method's alert being fired, but on occasion, it would fire the alert in the original function as well.

有人知道重写$ .mobile中的方法并添加两个新属性的正确方法吗?

Does anyone know the proper way to override a method in $.mobile and also add two new properties?

(有关原始问题的完整详细信息,请参见

(Full details about the original issue are in window.resize due to virtual keyboard causes issues with jquery mobile)

更新:

@elclanrs-我尝试实现下面的代码很幸运.我也尝试过交换第二个和第三个参数.每当我运行代码时,它都会触发扩展的getScreenHeight,但随后会触发基本的getScreenHeight. (我掏空了原始的getScreenHeight,并在其中放置了一个警报.该警报永远不会触发.

@elclanrs - I've tried to implement the code below with no luck. I've also tried swapping the second and third parameters. Whenever I run the code, it fires my extended getScreenHeight, but then it fires the base getScreenHeight. (I hollowed out the original getScreenHeight and put an alert inside. That alert should never fire.

思想开放!

$.mobile = $.extend( {}, $.mobile, {
    last_width: null,
    last_height: null,
    getScreenHeight: function() {
        // My code...
    }
} );

有问题的行似乎是getScreenHeight = $.mobile.getScreenHeight;,它将当前定义放在resetActivePageHeight函数的闭包内.我不确定是否可以在不编辑文件的情况下直接覆盖它,但是您可能可以将其移到下游:

The offending line seems to be a getScreenHeight = $.mobile.getScreenHeight; which places the current definition inside a closure for the resetActivePageHeight function. I'm not sure it's possible to override this directly without editing the file, but you might be able to head it off downstream:

  //simply set the active page's minimum height to screen height, depending on orientation
  function resetActivePageHeight() {
    var aPage = $( "." + $.mobile.activePageClass ),
      aPagePadT = parseFloat( aPage.css( "padding-top" ) ),
      aPagePadB = parseFloat( aPage.css( "padding-bottom" ) ),
      aPageBorderT = parseFloat( aPage.css( "border-top-width" ) ),
      aPageBorderB = parseFloat( aPage.css( "border-bottom-width" ) );

    aPage.css( "min-height", getScreenHeight() - aPagePadT - aPagePadB - aPageBorderT - aPageBorderB );
  }


  //set page min-heights to be device specific
  $( document ).bind( "pageshow", resetActivePageHeight );
  $( window ).bind( "throttledresize", resetActivePageHeight );

定义自己的resetActivePageHeight,然后再次unbind定义和bind可能会成功.有点混乱.

Defining your own resetActivePageHeight then unbinding and binding those again might do the trick. It's a bit messy.