2013-01-05 26 views
6

Im Moment ergibt, habe ich den folgenden Code haben:auf einen Link einen Klick Simulieren in Javascript/jQuery, die normale Browser-Verhalten

<script> 
$("#clickme").click(function(){ 
    $("#clicker").click(); 
}); 
</script> 
<div id="clickme" style="height:20em; width:20em;"> 
    <a id="clicker" href="http://www.google.com"> Link </a> 
</div> 

effektiv, auf dem Hintergrund div, wenn Sie überall klicken, wird die Javascript eine simulieren Klicken Sie auf den Link und Sie gelangen zur Zielseite.

Allerdings funktioniert das nicht ganz so gut, wenn Sie versuchen, auf gedrückter Ctrl-Taste, wie der Browser keine neue Registerkarte öffnen, und stattdessen lädt einfach die URL in das aktuelle Fenster.

Anstatt dieses Verhaltens möchte ich ein normales Browserverhalten haben (d. H. Eine neue Registerkarte öffnen, das aktuelle Fenster für einen Ctrl-Klick nicht ändern), wenn auf den Hintergrund geklickt wird. Gibt es eine Möglichkeit, dies in Javascript/jQuery zu tun?

Ich würde lieber nicht versuchen zu erkennen, dass die "Strg" -Taste gedrückt wird - es gibt ein paar ähnliche Fälle und ich hätte lieber eine Lösung, die alles löst, anstatt zu versuchen, jeden Rand Fall so zu fangen.

+0

Betrachten Sie diese Frage: http://stackoverflow.com/questions/7867329/jquery-open-url-in-new-tab –

Antwort

2

Eine Funktion, die diese (entweder neuen Fenster oder Tab, kann das nicht kontrollieren) tun ...

function open_url(url) { 
    if (flag) { 
     window.open(url, '_blank'); 
     window.focus(); 
    } else { 
     window.location.href = url; 
    } 
} 

Natürlich werden Sie die Ctrl keypress zu erfassen haben ...

$(window).keypress(function(event) { 
    if (event.ctrlKey) { 
     // set flag 
     flag = true; 
    } else { 
     // unset flag 
     flag = false; 
    } 
}); 
2

ich weiß, das kein Javascript, aber ich denke, dass eine gute Lösung, die eine absolut positionierte Link zu verwenden wäre gesetzt und sein z-index auf eine negative Zahl, so dass in der div auf den Inhalt klicken, wird nicht auf die gehen Verknüpfung. (es sei denn, dies ist nicht erwünscht, nur den Z-Index zu ignorieren). Wenn Sie auf den Hintergrund des Divs klicken, verhält es sich wie ein normaler Link. See this fiddle

Hier ist der HTML

<div id="clickme"><a id="clicker" href="http://suu.edu"></a><p>text text</p></div> 

Und die CSS

#clickme{ 
    position: relative; 
    width: 500px; 
    height: 500px; 
    border: 1px solid #000; 
    z-index: 1; 
} 

#clicker{ 
    position: absolute; 
    width: 100%; 
    height: 100%; 
    z-index: -1; 
} 

Sie die cursor mit CSS ändern, wenn Sie es wie die div ist ein Link sehen nicht wollen .

Verwandte Themen