Cara mensimulasikan target = "_ blank" dalam JavaScript

156

Ketika pengguna mengklik tautan, saya perlu memperbarui bidang dalam database dan kemudian membuka tautan yang diminta di jendela baru. Pembaruan tidak masalah, tapi saya tidak tahu cara membuka jendela baru tanpa mengharuskan mereka mengklik hyperlink lain.

<body onLoad="document.getElementById('redirect').click">
<a href="http://www.mydomain.com?ReportID=1" id="redirect" target="_blank">Report</a>
</body>
javascript Phillip Senn
sumber
1
Hm? target="_top"tidak terbuka di jendela baru - target="_blank"tidak.
Tomalak
Jika tautan sudah terbuka di jendela baru (karena target = "_ blank") dan penangan klik javascript sudah memperbarui basis data Anda, mengapa Anda harus membuka jendela baru dengan Javascript sama sekali?
Joel Mueller

Jawaban:

298 
<script>
    window.open('http://www.example.com?ReportID=1', '_blank');
</script>

Parameter kedua adalah opsional dan merupakan nama dari jendela target.

ChristopheD
sumber
2
window.openmelakukan apa yang target="_blank"dilakukan - membuka URL di jendela baru.
ceejayoz
3
Iya. argumen kedua ke window.open () adalah "nama" yang ingin Anda berikan jendela, mirip dengan menetapkan target pada tautan. developer.mozilla.org/En/DOM:window.open
Omer Bokhari
2
Oh begitu. window.open diblokir oleh pemblokir pop-up Firefox, tetapi target = "_ blank" tidak. Haruskah saya meminta klien untuk mengaktifkan popup dari situs web mereka sendiri?
Phillip Senn
7
Apakah ada solusi JavaScript yang tidak diblokir oleh pemblokir pop-up seperti Firefox?
ma11hew28
4
@MattDiPasquale memblokir window.open adalah inti dari pemblokir pop-up! Jika Anda melakukan panggilan sebagai respons terhadap tindakan klik, peluangnya lebih besar untuk tidak diblokir.
William Denniss
19

Ini mungkin bisa membantu

var link = document.createElementNS("http://www.w3.org/1999/xhtml", "a");
    link.href = 'http://www.google.com';
    link.target = '_blank';
    var event = new MouseEvent('click', {
        'view': window,
        'bubbles': false,
        'cancelable': true
    });
    link.dispatchEvent(event);
Jair Reina
sumber
IE11: "Runtime Javascript error: bukan tindakan yang valid untuk objek"
T-moty
8
Jawaban ini dapat ditingkatkan dengan menambahkan beberapa deskripsi tentang apa yang terjadi
Elly Post
13

Saya tahu ini adalah kesepakatan yang dilakukan dan diselesaikan, tapi inilah yang saya gunakan untuk menyelesaikan masalah di aplikasi saya.

if (!e.target.hasAttribute("target")) {
    e.preventDefault();     
    e.target.setAttribute("target", "_blank");
    e.target.click();
    return;
}

Pada dasarnya apa yang terjadi di sini adalah saya menjalankan pemeriksaan apakah tautan tersebut memiliki target=_blankatribut. Jika tidak, itu menghentikan tautan dari memicu, mengaturnya untuk membuka di jendela baru kemudian mengkliknya secara terprogram.

Anda dapat melangkah lebih jauh dan melewati penghentian klik asli (dan membuat kode Anda jauh lebih kompak) dengan mencoba ini:

if (!e.target.hasAttribute("target")) {
    e.target.setAttribute("target", "_blank");
}

Jika Anda menggunakan jQuery untuk mengabstraksi implementasi menambahkan cross-browser atribut, Anda harus menggunakan ini alih-alih e.target.setAttribute("target", "_blank"):

    jQuery(event.target).attr("target", "_blank")

Anda mungkin perlu mengolahnya agar sesuai dengan case-use yang tepat, tapi beginilah cara saya menggaruk gatal saya sendiri.

Berikut ini demo untuk Anda mainkan.

(Tautan di jsfiddle kembali ke diskusi ini .. tidak perlu tab baru :))

akamaozu
sumber
1
Saya lebih suka jawaban ini dari semua karena, yah, itu menggunakan jquery, dan itu menghindari masalah popup blocker window.open. Ini sangat sah ketika berurusan dengan beberapa data pihak ketiga yang berisi tautan yang tidak memiliki target.
IncredibleHat
7

Saya pribadi lebih suka menggunakan kode berikut jika hanya untuk satu tautan. Kalau tidak, mungkin yang terbaik jika Anda membuat fungsi dengan kode yang sama.

onclick="this.target='_blank';"

Saya mulai menggunakannya untuk melewati tes ketat XHTML W3C.

Zennethe Fuchs
sumber
1
Saya pikir inline JavaScript lebih berantakan daripada menambahkan atribut "non-standar" yang berfungsi di mana-mana.
Matti Virkkunen
@MattiVirkkunen dalam situasi tertentu itu adalah satu-satunya solusi
Claudiu Creanga
1
@Claudiu: Jika Anda menemukan diri Anda dalam situasi yang absurd seperti itu, Anda sebaiknya memperbaiki penyebabnya daripada menguranginya.
Matti Virkkunen
5

Ini adalah bagaimana saya melakukannya dengan jQuery. Saya memiliki kelas untuk setiap tautan yang ingin saya buka di jendela baru.

$(function(){

    $(".external").click(function(e) {
        e.preventDefault();
        window.open(this.href);
    });
});
Jindra Helcl
sumber
2

Anda dapat mengekstrak href dari tag:

window.open(document.getElementById('redirect').href);
treznik
sumber
1

Ini mungkin membantu Anda untuk membuka semua tautan halaman :

$(".myClass").each(
     function(i,e){
        window.open(e, '_blank');
     }
);

Ini akan membuka setiap <a href="" class="myClass"></a>item tautan ke tab lain seperti Anda mengklik masing-masing item.

Anda hanya perlu menempelkannya ke konsol peramban. Kerangka kerja jQuery diperlukan

radacina
sumber