2011-07-27 29 views
6

üzerinde bir metin içindeki tüm metin seçme çapraz tarayıcı çözüm: metin tüm metin seçilir JavaScript: Aşağıdaki işlevselliği peşindeyim odak

  • bir metin kutusu

    • kullanıcı tıkladığında veya sekmeler, metin kutusu zaten odağa sahip olmadıkça, bu durumda varsayılan tıklama/seçme işlevselliği

    Bu mümkün mü?


    Bu Firefox'ta çalışmaktadır 5

    $('input[type="text"]').live('focus', function() { 
        this.select(); 
    }); 
    

    http://jsfiddle.net/HmQxZ/13/

    Krom ve IE8 ikinci yalnızca bir an için tüm metni seçer


    Bu

    Chrome
    yılında * çalışır
    $('input[type="text"]').live('click', function() { 
        this.select(); 
    }); 
    

    http://jsfiddle.net/HmQxZ/12/

    Firefox ve IE8 tüm metni seçer ancak daha sonraki tıklayarak üzerine, metin seçili kalır. metin kutusu odağa sahip sonra

    * eserlerin tür, üzerine tıklayarak tüm metni seçip yanıp şapka nereye gittiğini tıklayın edememek arasında dönüşümlü. Bu muhtemelen kabul edilebilir.

  • +0

    Bunu test etmedim, ancak tüm metni seçerek, kullanıcının ctrl-A tuşlarına basarak seçtiği şekilde olduğu gibi, alanın başına/başına veya sonuna/sonuna kaydırmasını sağlar. (Açıkça kaydırılabilmek için yeterince metin girildiğini varsayarak)? Öyleyse, kullanıcının muhtemelen yazmaya başlamak istediği noktaya tıklamaya çalıştığı bir fare tıklaması olayında yapmaktan kaçınmaya çalışırdım. – nnnnnn

    cevap

    9

    Alındığı

    $("#myInputField").focus(function(){ 
        // Select input field contents 
        this.select(); 
    }); 
    
    // Add this behavior to all text fields 
    $("input[type=text]").focus(function(){ 
        // Select field contents 
        this.select(); 
    }); 
    

    Sadece setTimeout bir milisaniye bunu geciktirmek: Ne oluyor

    $('input[type="text"]').live('focus', function() { 
        var inp = this; 
        setTimeout(function() { 
         inp.select(); 
        }, 1); 
    }); 
    

    http://jsfiddle.net/HmQxZ/14/

    Eğer ettik sonra bazı diğer tarayıcı olay seçimini ayarlıyor olduğunu metni seçti. Yani, bir milisaniye bekleyerek, tüm tarayıcı olaylarının bitmesine izin verin ve ardından metni seçin. Artık hiçbir şey geri almayacak.

    +0

    Açıklama. Diğer tüm cevaplar hala çapraz tarayıcı uyumluluğu ile aynı sorunları vardı. Diğer olayın buna neden olacağını biliyor musun? – ajbeaven

    +0

    @ajbeaven Bir event.preventDefualt() işlevini denemeliyim, bu olayın varsayılan olarak geçersiz kılınması gerekir (bu hiçbir şey seçmez): http://api.jquery.com/event.preventDefault/ –

    +0

    Yanıtınız düzeltildi. problem, 'preventDefault' ve 'false 'ekleyerek önerilen diğer cevaplar gibi yardımcı olmadı. – ajbeaven

    0

    Sen fonksiyona

    event.preventDefault(); 
    return false; 
    

    (ilki) eklemek isteyebilir. Bu diğer tarayıcıları düzeltebilir.

    Ayrıca fonksiyon sig için event ekleyin: yapmak

    $('input[type="text"]').live('focus', function (event) { 
    
    +0

    , firefox veya IE8'deki bir metin kutusuna iki kez tıklamayı deneyin. Tüm metni seçmek için metin kutusunun herhangi bir yerinde bir kez daha sonra da metni metin içinde bir konuma taşımak ve hareket ettirmek için. İkinci tıklama, tüm metni yeniden seçer ve karta yerleştirmez. – ajbeaven

    0

    Hatırlıyor gereken bir return false; event.stopPropagation(); event.preventDefault() şöyle:

    $('input[type="text"]').live('click', function (event) { 
        this.select(); 
        event.stopPropagation(); 
        event.preventDefault(); 
        return false; 
    }); 
    

    http://jsfiddle.net/7rYLV/

    0

    sonra jQuery kullanabiliyorsanız yapabilirsiniz bir şey yap; HERE