Bir tıklama olay dinleyicisine 'return false' eklemenin etkisi nedir?

Çoğu zaman HTML sayfalarında böyle bağlantılar gördüm:

<a href='#' onclick='someFunc(3.1415926); return false;'>Click here !</a>

İçindeki etkisi nedir return false?

Ayrıca, genellikle düğmelerde göremiyorum.

Bu herhangi bir yerde belirtilmiş mi? W3.org'daki bazı spesifikasyonlarda?

Olay işleyicisinin dönüş değeri, varsayılan tarayıcı davranışının da gerçekleşip gerçekleşmeyeceğini belirler. Bağlantıların tıklanması durumunda, bu bağlantıyı takip eder, ancak fark, form bilgileri işleyicilerinde en belirgindir, burada kullanıcı bilgileri girerken bir hata yaptıysa form gönderimini iptal edebilirsiniz.

Bunun için bir W3C spesifikasyonu olduğuna inanmıyorum. Bu gibi tüm eski JavaScript arabirimlerine "DOM 0" takma adı verilmiştir ve çoğunlukla belirtilmemişlerdir. Eski Netscape 2 belgelerini okurken şansınız olabilir.

Bu efekti elde etmenin modern yolu aramaktır event.preventDefault()ve bu DOM 2 Events spesifikasyonunda belirtilmiştir .

Farkı aşağıdaki örnekle görebilirsiniz:

<a href="http://www.google.co.uk/" onclick="return (confirm('Follow this link?'))">Google</a>

"Tamam" tıklandığında true döndürülür ve bağlantı izlenir. "İptal" i tıklamak yanlış döndürür ve bağlantıyı takip etmez. Javascript devre dışı bırakılmışsa, bağlantı normal olarak izlenir.

İşte tüm tarayıcılarda varsayılan davranışı ve olay köpürmeyi iptal etmek için daha sağlam bir rutin:

// Prevents event bubble up or any usage after this is called.
eventCancel = function (e)
{
    if (!e)
        if (window.event) e = window.event;
    else return;
    if (e.cancelBubble != null) e.cancelBubble = true;
    if (e.stopPropagation) e.stopPropagation();
    if (e.preventDefault) e.preventDefault();
    if (window.event) e.returnValue = false;
    if (e.cancel != null) e.cancel = true;
}

Bunun bir olay işleyicisinde nasıl kullanılacağına bir örnek:

// Handles the click event for each tab
Tabstrip.tabstripLinkElement_click = function (evt, context) 
{
    // Find the tabStrip element (we know it's the parent element of this link)
    var tabstripElement = this.parentNode;
    Tabstrip.showTabByLink(tabstripElement, this);
    return eventCancel(evt);
}

NE "dönüş false" GERÇEKTEN YAPACAK?

return false aslında onu çağırdığınızda üç ayrı şey yapıyor:

1. event.preventDefault ();
2. Event.stopPropagation ();
3. Geri arama işlemini durdurur ve çağrıldığında hemen geri döner.

Daha fazla bilgi için jquery-events-stop-misusing-return-false dosyasına bakın .

Örneğin :

bu bağlantıyı tıkladığınızda false döndür, tarayıcının varsayılan davranışını iptal eder .

<a href='#' onclick='someFunc(3.1415926); return false;'>Click here !</a>

Bir JavaScript etkinliğinden false değerini yeniden ayarlamak genellikle "varsayılan" davranışı iptal eder - bağlantı olması durumunda tarayıcıya bağlantıyı izlememesini söyler.

Bunun standart olayın gerçekleşmemesine neden olduğuna inanıyorum.

Örneğinizde tarayıcı # konumuna gitmeye çalışmaz.

Return false, javascript çalıştırıldıktan sonra izlenen köprüyü durduracaktır. Bu, incelikle bozulan göze batmayan javascript için kullanışlıdır - örneğin, tam boyutlu görüntünün pop-up'ını açmak için javascript kullanan bir küçük resminiz olabilir. Javascript kapatıldığında veya görüntü orta tıklandığında (yeni bir sekmede açılır) bu, onClick olayını yok sayar ve görüntüyü normal olarak tam boyutlu bir görüntü olarak açar.

Return false belirtilmezse, resim hem açılır pencereyi başlatır hem de normal şekilde açar. Dönüş yanlış kullanmak yerine bazı insanlar, href özniteliği olarak javascript kullanır, ancak bu, javascript devre dışı bırakıldığında bağlantının hiçbir şey yapmayacağı anlamına gelir.

onclick olayında return false kullanılması, tarayıcının href özniteliğindeki bağlantının izlenmesini içeren yürütme yığınının geri kalanını işlemesini durdurur.

Başka bir deyişle, return false eklenmesi href'in çalışmasını durdurur. Örneğinizde, tam olarak istediğiniz budur.

Düğmelerde gerekli değildir, çünkü onclick yürüteceği tek şeydir - işlemek ve gitmek için bir href yoktur.

Return false, varsayılan bir işlem yapmamayı söyler; bu durumda <a href>, bağlantıyı izlemektir. Onclick'e false döndürdüğünüzde, href yok sayılır.

Tarayıcı kesmek: http://jszen.blogspot.com/2007/03/return-false-to-prevent-jumping.html

False değerini döndürürse navigasyon engellenir. Aksi takdirde, konum someFunc öğesinin dönüş değeri olur

return falseÖnler, sayfa navigasyon ve üst veya alt bir pencere istenmeyen kaydırma edilir.

onclick="return false"

Bunun onmousedownyerine kimsenin bahsetmediğine şaşırdım onclick.

onclick='return false'

tarayıcının varsayılan davranışını yakalamaz (bazen istenmeyen) metin seçimiyle sonuçlanır mousedownancak

onmousedown='return false'

yapar.

Başka bir deyişle, bir düğmeyi tıklattığımda, metni bazen istenmeden olabilecek düğmenin görünümünü değiştirerek yanlışlıkla seçilir. Burada önlemeye çalıştığımız varsayılan davranış budur. Ancak, mousedownolay daha önce kaydedilmiştir click, bu nedenle yalnızca clickişleyicinizin içindeki davranışı önlerseniz, mousedownolaydan kaynaklanan istenmeyen seçimi etkilemez . Böylece metin hala seçiliyor. Ancak, mousedownetkinlik için varsayılan ayarı önlemek işi yapar.

Ayrıca bkz. Event.preventDefault () ve return false

HTML sayfamda bu bağlantı var:

<a href = "" 
onclick = "setBodyHtml ('new content'); return false; "
> click here </a>

SetBodyHtml () işlevi şu şekilde tanımlanır:

function setBodyHtml (s)
{ document.body.innerHTML = s;
}

Bağlantıyı tıkladığımda bağlantı kaybolur ve tarayıcıda gösterilen metin "yeni içerik" olarak değişir.

Ama "yanlış" ı bağlantımdan kaldırırsam, bağlantıyı tıklatmak hiçbir şey yapmaz. Neden?

Yanlış döndürmezsem bağlantıyı tıklatıp hedef sayfasını görüntülemenin varsayılan davranışı gerçekleşmezse iptal edilmez. ANCAK, burada köprünün href "" olduğundan SAME geçerli sayfasına geri bağlanır. Böylece sayfa etkili bir şekilde yenilenir ve görünüşe göre hiçbir şey olmaz.

Arka planda setBodyHtml () işlevi hala yürütülüyor. Bağımsız değişkenini body.innerHTML'ye atar. Ancak sayfa hemen yenilendiği / yeniden yüklendiği için, değiştirilmiş gövde içeriği birkaç milisaniyeden fazla görünür kalmaz, bu yüzden görmeyeceğim.

Bu örnekte "return false" ifadesinin kullanılmasının neden YARARLI olduğu gösterilmektedir.

Bağlantıya altı çizili metin olarak görünmesi için bağlantıya BAZI href atamak istiyorum. Ancak, bağlantıyı tıklamanın yalnızca sayfayı yeniden yüklemesini istemiyorum. Varsayılan navigasyon = davranışın iptal edilmesini ve fonksiyonumun etkin kalması ve çağrılması için herhangi bir yan etkinin neden olmasını istiyorum. Bu nedenle "false döndürürüm".

Yukarıdaki örnek, geliştirme sırasında hızlı bir şekilde deneyebileceğiniz bir şeydir. Üretim için büyük olasılıkla JavaScript'te bir tıklama işleyicisi atar ve bunun yerine preventDefault () öğesini çağırırsınız. Ancak hızlı bir deneme için yukarıdaki "return false" hile yapar.

Formları kullanırken submit göndermeyi önlemek için 'return false' kullanabiliriz.

function checkForm() {
    // return true to submit, return false to prevent submitting
}
<form onsubmit="return checkForm()">
    ...
</form>