Come posso aprire un collegamento in una nuova finestra?

Ho un gestore di clic per un collegamento specifico, all'interno del quale voglio fare qualcosa di simile al seguente:

window.location = url

Ho bisogno di questo per aprire effettivamente l'URL in una nuova finestra, come posso farlo?

Ti può piacere:

window.open('url', 'window name', 'window settings')

jQuery:

$('a#link_id').click(function(){
  window.open('url', 'window name', 'window settings');
  return false;
});

Si potrebbe anche impostare la targeta _blankrealtà.

Ecco come forzare il target all'interno di un gestore di clic:

$('a#link_id').click(function() {
    $(this).attr('target', '_blank');
});

dovrai usare window.open(url);

riferimenti:
http://www.htmlcodetutorial.com/linking/linking_famsupp_120.html
http://www.w3schools.com/jsref/met_win_open.asp

Puoi anche usare il metodo jquery prop () per questo.

$(function(){
  $('yourselector').prop('target', '_blank');
}); 

Ho appena trovato una soluzione interessante a questo problema. Stavo creando intervalli che contengono informazioni basate sul ritorno da un servizio web. Ho pensato di provare a inserire un collegamento attorno all'intervallo in modo che se lo avessi cliccato, la "a" avrebbe catturato il clic.

Ma stavo cercando di catturare il clic con lo span ... quindi ho pensato perché non farlo quando ho creato lo span.

var span = $('<span id="something" data-href="'+url+'" />');

Quindi ho associato un gestore di clic allo span che ha creato un collegamento basato sull'attributo "data-href":

span.click(function(e) {
    e.stopPropagation();
    var href = $(this).attr('data-href');
    var link = $('<a href="http://' + href + '" />');
    link.attr('target', '_blank');
    window.open(link.attr('href'));
});

Ciò mi ha permesso di fare clic su un intervallo e di aprire una nuova finestra con un URL appropriato.

Cosa c'è che non va <a href="myurl.html" target="_blank">My Link</a>? Nessun Javascript necessario ...

questa soluzione ha considerato anche il caso in cui l'url è vuoto e disabilitato (grigio) il collegamento vuoto.

$(function() {
  changeAnchor();
});

function changeAnchor() {
  $("a[name$='aWebsiteUrl']").each(function() { // you can write your selector here
    $(this).css("background", "none");
    $(this).css("font-weight", "normal");

    var url = $(this).attr('href').trim();
    if (url == " " || url == "") { //disable empty link
      $(this).attr("class", "disabled");
      $(this).attr("href", "javascript:void(0)");
    } else {
      $(this).attr("target", "_blank");// HERE set the non-empty links, open in new window
    }
  });
}

a.disabled {
  text-decoration: none;
  pointer-events: none;
  cursor: default;
  color: grey;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<a name="aWebsiteUrl" href="http://www.baidu.com" class='#'>[website]</a>
<a name="aWebsiteUrl" href=" " class='#'>[website]</a>
<a name="aWebsiteUrl" href="http://www.alibaba.com" class='#'>[website]</a>
<a name="aWebsiteUrl" href="http://www.qq.com" class='#'>[website]</a>

Tenere presente se si desidera eseguire richieste AJAX all'interno della funzione del gestore eventi per l'evento click. Per qualche motivo Chrome (e forse altri browser) non aprirà una nuova scheda / finestra.

Questa non è una soluzione molto bella ma funziona:

CSS:

.new-tab-opener
{
    display: none;
}

HTML:

<a data-href="http://www.google.com/" href="javascript:">Click here</a>
<form class="new-tab-opener" method="get" target="_blank"></form>

Javascript:

$('a').on('click', function (e) {    
    var f = $('.new-tab-opener');
    f.attr('action', $(this).attr('data-href'));
    f.submit();
});

Esempio dal vivo: http://jsfiddle.net/7eRLb/

Microsoft IE non supporta un nome come secondo argomento.

window.open('url', 'window name', 'window settings');

Il problema è window name. Questo funzionerà:

window.open('url', '', 'window settings')

Microsoft consente solo i seguenti argomenti, se si utilizza tale argomento:

• _blank
• _media
• _genitore
• _ricerca
• _se stesso
• _superiore

Controlla questo sito Microsoft