JavaScript kullanarak tüm metnin seçimini kaldırmak için bir işlev var mı?

102

JavaScript'te yalnızca tüm seçili metnin seçimini kaldırmak için bir işlev var mı? Sanırım basit bir küresel işlev document.body.deselectAll();falan olmalı.

javascript selection

— NoodleOfDeath
kaynak

170

Bunu dene:

function clearSelection()
{
 if (window.getSelection) {window.getSelection().removeAllRanges();}
 else if (document.selection) {document.selection.empty();}
}

Bu, herhangi bir ana tarayıcıda normal HTML içeriğindeki bir seçimi temizleyecektir. Metin girişindeki veya <textarea>Firefox'taki bir seçimi temizlemez .

— Ankur
kaynak

26

Bunun window.getSelection().removeAllRanges();mevcut tüm tarayıcılarda çalıştığını onaylayabilirim . Canlı tanıtım: jsfiddle.net/hWMJT/1

— Šime Vidas

<input id = 'but' type = 'button' value = 'click' / onclick = 'clearSelection ()'> gibi bir düğmeyi tıklamanız gerekir

— Ankur

1

@ Šime - pek değil. "Çalışıyor" çünkü düğme odaklandığında seçim kayboluyor. Kanıt - kod yorumlanır, seçim yine de temizlenir.

— Gölge Sihirbazı Sizin İçin Kulak

İşte @Shadow uygun demo: jsfiddle.net/9spL8/3removeAllRanges() yöntemi paragraflar veya benzer olmayan form alan öğelerinin içindeki metin için geçerli tüm tarayıcılarda çalışır. Form alanları için (metin alanı gibi), bu yöntem IE9 ve FF5'te çalışmaz.

— Šime Vidas

1

Düzenlendi, window.getSelection().removeAllRanges(); önce kullanın çünkü standartlara uygun, özel kod her zaman en son çalıştırılmalıdır . 2004 yılı veya 4004 standartlarına uygun kod her zaman bizim kullandığımız şey olacaktır, bu nedenle ilk önce istisnasız tespit edin!

— John

27

Metin girişleri ve metin alanları dahil olmak üzere herhangi bir seçimi temizleyecek bir sürüm:

Demo: http://jsfiddle.net/SLQpM/23/

function clearSelection() {
    var sel;
    if ( (sel = document.selection) && sel.empty ) {
        sel.empty();
    } else {
        if (window.getSelection) {
            window.getSelection().removeAllRanges();
        }
        var activeEl = document.activeElement;
        if (activeEl) {
            var tagName = activeEl.nodeName.toLowerCase();
            if ( tagName == "textarea" ||
                    (tagName == "input" && activeEl.type == "text") ) {
                // Collapse the selection to the end
                activeEl.selectionStart = activeEl.selectionEnd;
            }
        }
    }
}

— Tim Down
kaynak

seçiminiz ilk satırdan bir yerde başlıyorsa ve daha büyük metin alanını

— içeriyorsa çalışmaz

1

@VyachaslavGerchicov: Bir hızlıca yapımı basit bir örnek çünkü muhtemelen ve ana dışında seçimin sona ermesini eğer <div>o mouseupolay ateş yapmaz. Bunun yerine mouseup işleyicisini belgeye koyun ve sorun olmaz: jsfiddle.net/SLQpM/23

— Tim Down

Bu, öğeleri sürüklerken kullanıcı tarafından seçilen CSS'yi desteklemeyen eski tarayıcılarda harika bir çözümdür. Fare hareketi geri aramasında clearSelection () öğesini çağırın.

— Geordie

6

Internet Explorer için, document.selection nesnesinin boş yöntemini kullanabilirsiniz :

document.selection.empty ();

Tarayıcılar arası bir çözüm için şu yanıta bakın:

Firefox'ta bir seçimi temizleyin

— Luke Girvin
kaynak

Web siteniz herkese açıksa (tarayıcıları kontrol ettiğiniz intranet değil), bu iyi bir fikir değildir, tarayıcılar arası değildir.

— Gölge Sihirbazı Sizin İçin Kulak

1

@Shadow Wizard - doğru, bu soru tarayıcılar arası bir çözümle ilgili olabilir: stackoverflow.com/questions/6186844/…

— Luke Girvin

@Luke güzel, OP verdiğiniz şeyi olduğu gibi aldığından başka bir web sitesinin farklı tarayıcılar arasında (muhtemelen) tutarlı olmayacağı için çok kötü.

— Gölge Sihirbazı Sizin İçin Kulak

Benim görüşüme göre tarayıcı uyumluluğu, bizim tarafımızdan sunulması gereken açık bir şeydir - birçok geliştirici bu tür farklılıkların var olduğunun farkında bile değildir, bu yüzden bilenler onlara söylemelidir. Bu bir yana, sorunun yanlış olduğunu asla söylemedim , sadece eksik .

— Gölge Sihirbazı Sizin İçin Kulak

@Luke yalnızca IE'de document.selection.clear()çalışır . Buraya bakın: jsfiddle.net/9spL8/4 Ayrıca, bu yöntem sadece seçimi kaldırmakla kalmaz, seçilen metni de kaldırır . Metnin seçimini kaldırmak için bunun yerine kullanın. document.selection.empty()

— Šime Vidas

0

textareaEn az 10 karakter içeren bir öğe için, aşağıdakiler küçük bir seçim yapacak ve ardından bir buçuk saniye sonra seçimi kaldıracaktır:

var t = document.getElementById('textarea_element');
t.focus();
t.selectionStart = 4;
t.selectionEnd = 8;

setTimeout(function()
{
 t.selectionStart = 4;
 t.selectionEnd = 4;
},1500);

— John
kaynak

0

Bu benim için inanılmaz derecede kolay çalıştı ...

document.getSelection().collapseToEnd()

veya

document.getSelection().removeAllRanges()

Krediler: https://riptutorial.com/javascript/example/9410/deselect-everything-that-is-selected

— Dan Ortega
kaynak