Anchor "javascript: void (0)" verursacht window.onbeforeunload auf IE

Question

Ich verwende ein Dropdown-Widget namens Chosen, die einen Anker mit einem href javascript:void(0) hat. Wenn ich auf das Drop-Down-Menü klicke, funktioniert es, aber auf IE wird ein neues onbeforeunload Ereignis ausgelöst, was frustrierend ist, weil die Anwendung bestätigt, ob Sie gehen wollen. Und offensichtlich möchten Sie diese Fragen nicht haben, wenn Sie Formulardaten eingeben.

Gibt es eine Möglichkeit, dieses Problem loszuwerden, ohne die ausgewählte Bibliothek zu ändern?

Leider ist dieses:

window.onbeforeunload = function (e) { 
    console.log(window.location); 
}; 

loggt nicht javascript:void(0) entweder, so kann ich es nicht verwenden, um die Ziel-URL zu überprüfen.

Dieses Verhalten tritt in IE9 zumindest auf, und das ist, was mich betrifft (nicht die älteren IEs).

Answer 1

Die einzige Lösung, die ich sehen kann, ist die Rückkehr von false zu dem onclick Event-Handler der Links hinzuzufügen. Es teilt dem IE mit, dass Sie nicht vorhaben, die Seite zu ändern, indem Sie auf den Link klicken.

<a href="javascript:void(0);" onclick="doSomething(); return false;">Link</a> 

Das gleiche auf diese Weise geschrieben werden kann:

<script> 
    function doSomething() { 
     // do Something 
     return false; 
    } 
</script> 

<a href="javascript:void(0);" onclick="return doSomething();">Link</a> 

Answer 2

ich hören endete Ereignisse gegen den Anker klicken und das Ereignis abbrechen onBeforeUnload von Zündung zu verhindern:

$chosen.find('.chzn-single').click(function() { 
    return false; 
}); 

Answer 3

Hatte Dasselbe Problem. Habe gerade deine Frage gefunden. Meine Lösung ist, müssen Sie Attribut auf jede gewählte Dropdown-Liste Anker-Tag und rufen window.onbeforeunload = null

In meinem Fall Onclick hinzuzufügen, habe ich

setzen

$(".chzn-single").attr("onclick", "window.onbeforeunload = null;"); 

Nachdem Sie gewählt Bibliothek und funktioniert gut

Answer 4

verwenden Sie nicht href für diese. Eine einfache Lösung mit minimaler Zusatzarbeit:

Ich bevorzuge eine CSS-Klasse, die eine href simuliert, natürlich werden Sie die Farbe und das Styling dieser Klasse an Ihre Website anpassen, aber zu diesem Zweck ist es der Standard blau unterstrichen

Link

<style> 
    .linkSimulate 
    { 
     cursor: pointer; 
     COLOR: blue; 
     text-decoration: underline; 
    } 
</style> 

dann mit einem einfachen Anker

<a onclick = "do_save();" class ="linkSimulate">Link</a> 

Answer 5

ich weiß, dass dies ziemlich alt ist ... Aber ich habe über diesen vor kurzem für meine Arbeit kommen. Wir sind leider immer noch gezwungen, IE9 zu unterstützen. Wir verwenden Angular.js für dieses Projekt, das neuen Inhalt dynamisch auf eine Seite lädt, wenn der Benutzer auf ein Anchor-Tag mit einem data-ng-click klickt.

In Ihrem Beispiel alles, was Sie tun müssten, ist das Ereignis übergeben und innerhalb der Funktion verhindern Sie die Standardaktion und stoppen Sie es sprudeln.Um all dies würden Sie dies tun müssen:

// Inside the HTML 
{...} 
<a href="javascript:void(0);" onclick="doSomething(evt);">Link</a> 
{...} 
<script> 
    function doSomething(evt) { 
     evt.preventDefault(); 
     evt.stopPropagation(); 
     // Do Something 
    }; 
</script> 
{...} 

In Angular alles, was ich tat, war die folgende:

// Inside the View 
<a href="javascript:void(0)" data-ng-click="addStuff($event)">Add Stuff</a> 

// Inside the controller 
function addStuff($event) { 
    $event.preventDefault(); 
    $event.stopPropagation(); 
    // Do Something 
}; 

Ich hoffe, dass dies nicht zu spät ist, und ich hoffe, dass es hilft, Andere.

Answer 6

Auch wenn diese Frage ist alt, habe ich die Antwort von @Bartosz anhanced, das Thema im Kommentar von @Oiva Eskola Festsetzung:

würde dies die window.onbeforeunload nicht verhindern, arbeitet nach Klicken Sie auf ein ausgewähltes Linkelement? - var thisOnClick;

Unten ist meine Lösung, um die HTML onclick Eigenschaft richtig zu erstellen, nicht außer Kraft zu setzen oder das Ereignis abbrechen:

  var thisOnClick; 

      $.each($(' .container a '), function(){ 

       thisOnClick = $(this).attr('onclick'); 

       if (typeof thisOnClick == 'undefined') { 

        $(this).attr('onclick', 'window.onbeforeunload = null;'); 

       } else if (typeof thisOnClick == 'string' && thisOnClick.indexOf('window.onbeforeunload') == -1 ) { 

       $(this).attr('onclick', thisOnClick + 'window.onbeforeunload = null;'); 
      } 

     });