2010-01-19 27 views
9

Chrome, textareas'ı varsayılan olarak yeniden boyutlandırılabilir hale getirir. Textareas için yeniden boyutlandırma etkinliklerine olayları nasıl ekleyebilirim? Naif $('textarea').resize(function(){...}) yapmak hiçbir şey yapmaz.jQuery: Chrome tekstüre ve yeniden boyutlandırma olayı

+1

jQuery(document).ready(function(){ // set init (default) state var $test = jQuery('#test'); $test.data('w', $test.outerWidth()); $test.data('h', $test.outerHeight()); $test.mouseup(function(){ var $this = jQuery(this); if ( $this.outerWidth() != $this.data('w') || $this.outerHeight() != $this.data('h') ) alert($this.outerWidth() + ' - ' + $this.data('w') + '\n' + $this.outerHeight() + ' - ' + $this.data('h')); // set new height/width $this.data('w', $this.outerWidth()); $this.data('h', $this.outerHeight()); }); }); 

HTML ve bir tıklamadan sonra. – Sampson

cevap

8

Özellikle bir textarea yeniden boyutlandırmak için olayları ekleyebilirsiniz gibi görünmüyor. Yeniden boyutlandırma, pencere yeniden boyutlandırıldığında patlar.

7

bunu şimdi test edemez, ancak this forum entry göre o kullanılarak devre dışı bırakılabilir:

style="resize: none;" 
söz konusu girişin belirtilen aksine

, max-width ve max-height kesmeyecek - teşekkürler @Jonathan Sampson'la bilgi için.

+2

+1 'yeniden boyutlandır: yok 'bunu devre dışı bırakır. "max-width" ve "max-height" yapmadı: http://jsbin.com/inane – Sampson

+0

Şerefe Jonathan. Cevabımı buna göre güncelledim. –

5

CoffeeScript kullanılarak yazılmış bir jQuery eklentisi. Jonathan Sampson'dan bir fikir.

$.fn.sizeId = ->               
    return this.height() + "" + this.width()        

$.fn.textAreaResized = (callback) ->          
    this.each ->               
     that = $ this              
     last = that.sizeId() 
     that.mousedown ->             
      last = that.sizeId()           
     that.mousemove ->             
      callback(that.get(0)) if last isnt that.sizeId()    

Sen CoffeeScript Web Sitesini

http://jashkenas.github.com/coffee-script/

Kullanım "CoffeeScript deneyin" düğmesine Javascript bunu inşa edebilirsiniz.

0

Ben mousedown üzerinde yeniden boyutlandırma() olayı tetiklemek için temiz bir çözüm üzerinde başlatmak için denedim: http://jsfiddle.net/cburgmer/jv5Yj/3/ Ancak Chrome, yeniden boyutlandırma işleyicisinde mousedown'u tetiklemediği için yalnızca Firefox'ta çalışır. Ancak, fare başlangıçlarını tetikler.

5

Bu eski bir soru ama başkasının IRC aynısından vardı, bu yüzden buraya çözmek için karar: Krom resize olayı yakalamak değil http://jsfiddle.net/vol7ron/Z7HDn/

Herkesin hakkını ve Chrome yapmasa o Eğer init durumunu ayarlamak ve sonra mouseUp ile değişiklikler ele gerekir, böylece mousedown yakalamak: Daha önce genişliğini kontrol edebilir

<textarea id="test"></textarea> 
İlgili konular