ฉันจะเปิดลิงค์ในหน้าต่างใหม่ได้อย่างไร?

ฉันมีตัวจัดการการคลิกสำหรับลิงก์เฉพาะซึ่งฉันต้องการทำสิ่งที่คล้ายกับสิ่งต่อไปนี้:

window.location = url

ฉันต้องการสิ่งนี้เพื่อเปิด url ในหน้าต่างใหม่จริงๆฉันจะทำอย่างไร

คุณสามารถชอบ:

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

jQuery:

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

นอกจากนี้คุณยังสามารถตั้งค่าtargetการ_blankจริง

วิธีบังคับเป้าหมายภายในเครื่องจัดการคลิกมีดังนี้

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

คุณจะต้องใช้ window.open(url);

ข้อมูลอ้างอิง:
http://www.htmlcodetutorial.com/linking/linking_famsupp_120.html
http://www.w3schools.com/jsref/met_win_open.asp

คุณยังสามารถใช้ jquery prop () วิธีการนี้

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

ฉันเพิ่งพบวิธีแก้ปัญหาที่น่าสนใจสำหรับปัญหานี้ ฉันกำลังสร้างช่วงที่มีข้อมูลตามผลตอบแทนจากบริการบนเว็บ ฉันคิดว่าจะพยายามใส่ลิงค์รอบ ๆ ช่วงเวลาเพื่อที่ว่าถ้าฉันคลิกที่มัน "a" จะจับการคลิก

แต่ฉันพยายามจับภาพการคลิกด้วยช่วงเวลา ... ดังนั้นฉันจึงคิดว่าทำไมไม่ทำสิ่งนี้เมื่อฉันสร้างช่วง

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

จากนั้นฉันผูกตัวจัดการคลิกกับช่วงที่สร้างลิงก์ตามแอตทริบิวต์ "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'));
});

สิ่งนี้ทำให้ฉันสามารถคลิกที่ช่วงและเปิดหน้าต่างใหม่ด้วย url ที่ถูกต้องได้สำเร็จ

เกิดอะไรขึ้น<a href="myurl.html" target="_blank">My Link</a>? ไม่จำเป็นต้องใช้ Javascript ...

วิธีนี้ยังพิจารณากรณีที่ url ว่างเปล่าและปิดใช้งาน (สีเทา) ลิงก์ว่าง

$(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>

โปรดทราบว่าคุณต้องการดำเนินการตามคำขอ AJAXภายในฟังก์ชันตัวจัดการเหตุการณ์สำหรับเหตุการณ์คลิกหรือไม่ ด้วยเหตุผลบางประการ Chrome (และอาจเป็นเบราว์เซอร์อื่น ๆ ) จะไม่เปิดแท็บ / หน้าต่างใหม่

นี่ไม่ใช่การแก้ไขที่ดีมาก แต่ใช้งานได้:

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();
});

ตัวอย่างสด: http://jsfiddle.net/7eRLb/

Microsoft IE ไม่สนับสนุนชื่อเป็นอาร์กิวเมนต์ที่สอง

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

ปัญหาคือwindow name. สิ่งนี้จะได้ผล:

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

Microsoft อนุญาตเฉพาะอาร์กิวเมนต์ต่อไปนี้หากใช้อาร์กิวเมนต์นั้นเลย:

• _blank
• _ สื่อ
• _parent
• _ค้นหา
• _ ตัวเอง
• _top

ตรวจสอบไซต์ Microsoft นี้