Mở URL trong cùng một cửa sổ và trong cùng một tab


361

Tôi muốn mở một liên kết trong cùng một cửa sổ và trong cùng một tab có chứa trang có liên kết.

Khi tôi cố gắng mở một liên kết bằng cách sử dụng window.open, thì nó sẽ mở trong tab mới, không phải trong cùng một tab trong cùng một cửa sổ.

Câu trả lời:


600

Bạn cần sử dụng thuộc tính name:

window.open("https://www.youraddress.com","_self")

Chỉnh sửa : Url nên được chuẩn bị sẵn giao thức. Không có nó cố gắng để mở url tương đối. Đã thử nghiệm trong Chrome 59, Firefox 54 và IE 11.


2
Đối số thứ hai chỉ là một tên cho cửa sổ mới, giống như thuộc tính target=của thẻ a. Trong thực tế, bạn có thể đặt tên cho cửa sổ của bạn bất cứ điều gì bạn thích. Tất cả những gì bạn cần là đặt giá trị khác nhau để nó không mở trong cùng một cửa sổ hoặc tab.
ijse

12
@ijse Trên thực tế, có một vài cái tên đặc biệt, một trong số đó là '_elf' dùng để chỉ win / tab mà mã đang chạy .;)
vdbuilder

5
'_elf' không được chỉ định trong tài liệu MDN [ developer.mozilla.org/en-US/docs/Web/API/Window/open] trên window.open (). Một giải pháp đa trình duyệt hơn là sử dụng location.replace ().
Bryan Rayner

1
Liên kết MDN trong nhận xét ở trên là tự động liên kết đến 404. Liên kết là developer.mozilla.org/en-US/docs/Web/API/Window/open
groovecoder

_selfđược đề cập trong phần 5.1.6 Tên ngữ cảnh duyệt của Khuyến nghị HTML5 W3C ngày 28 tháng 10 năm 2014 tại: w3.org/TR/html/browsers.html#browsing-context-names (nhưng window.locationvẫn sạch hơn).
Dem Pilafian


62

Để đảm bảo rằng liên kết được mở trong cùng một tab, bạn nên sử dụng window.location.replace()

Xem ví dụ dưới đây:

window.location.replace("http://www.w3schools.com");

Nguồn: http://www.w3schools.com/jsref/met_loc numplace.asp


3
Nó không bảo tồn lịch sử duyệt web, chúng ta không nên sử dụng nó. thay vào đó hãy thử liên kết tham chiếu window.open (" google.com", "_ top" ) geekforgeek.org/iêu
shyam_

2
điều này tốt cho tôi, cảm ơn anh bạn
Angelus Roman

28

Bạn có thể đưa nó đến cùng một trang mà không chỉ định url:

window.open('?','_self');

Đó không phải là cùng một trang. Nó sẽ xóa bất kỳ chuỗi truy vấn nào khỏi URL hiện có.
Quentin

20

Nếu bạn có các trang của mình trong "khung" thì "Window.open ('logout.aspx', '_ self')"

sẽ được chuyển hướng trong cùng một khung. Vì vậy, bằng cách sử dụng

"Window.open('logout.aspx','_top')"

chúng tôi có thể tải trang theo yêu cầu mới.


11

Một trong những tính năng nổi bật nhất của javascript là kích hoạt trình xử lý onclick một cách nhanh chóng. Tôi tìm thấy sau cơ chế đáng tin cậy hơn so với sử dụng location.href=''hoặc location.reload()hay window.open:

// this function can fire onclick handler for any DOM-Element
function fireClickEvent(element) {
    var evt = new window.MouseEvent('click', {
        view: window,
        bubbles: true,
        cancelable: true
    });

    element.dispatchEvent(evt);
}

// this function will setup a virtual anchor element
// and fire click handler to open new URL in the same room
// it works better than location.href=something or location.reload()
function openNewURLInTheSameWindow(targetURL) {
    var a = document.createElement('a');
    a.href = targetURL;
    fireClickEvent(a);
}

Mã ở trên cũng hữu ích để mở tab / cửa sổ mới và bỏ qua tất cả các trình chặn cửa sổ bật lên !!! Ví dụ

function openNewTabOrNewWindow(targetURL) {
    var a = document.createElement('a');
    a.href = targetURL;

    a.target = '_blank'; // now it will open new tab/window and bypass any popup blocker!

    fireClickEvent(a);
}

10

Mở một url khác như nhấp chuột trong liên kết

window.location.href = "http://example.com";

8

Bạn có phải sử dụng window.open? Còn việc sử dụng window.location="http://example.com"thì sao?


5

window.open(url, wndname, params), nó có ba đối số. nếu bạn không muốn nó mở trong cùng một cửa sổ, chỉ cần đặt một tên khác. nhu la :

window.open(url1, "name1", params); // this open one window or tab
window.open(url1, "name2", params); // though url is same, but it'll open in another window(tab).

Dưới đây là chi tiết về window.open(), bạn có thể tin tưởng nó!
https://developer.mozilla.org/en/DOM/window.open

cố gắng lên ~


7
Câu hỏi rất rõ ràng về việc muốn mở trong cùng một cửa sổcùng một tab !
SNag

2

Với html 5, bạn có thể sử dụng API lịch sử .

history.pushState({
  prevUrl: window.location.href

}, 'Next page', 'http://localhost/x/next_page');
history.go();

Sau đó trên trang tiếp theo, bạn có thể truy cập đối tượng trạng thái như vậy

let url = history.state.prevUrl;
if (url) {
  console.log('user come from: '+ url)
}

1

Đó là khá dễ dàng. Mở cửa sổ đầu tiên nhưwindow.open(url, <tabNmae>)

Thí dụ: window.open("abc.com",'myTab')

và cho tất cả window.open tiếp theo, hãy sử dụng cùng tên tab thay vì _self, _parentv.v.


1

Chính xác như thế này window.open("www.youraddress.com","_self")


1
   Just Try in button.

   <button onclick="location.reload();location.href='url_name'" 
   id="myButton" class="btn request-callback" >Explore More</button>

   Using href 

  <a href="#" class="know_how" onclick="location.reload();location.href='url_name'">Know More</a> 

Hoàn toàn không có ý nghĩa gì khi kích hoạt tải lại trang hiện tại và sau đó hủy nó trong câu lệnh tiếp theo bằng cách tải một trang mới.
Quentin

-3

Như giới thiệu của MDN nói, chỉ cần cung cấp tên của cái mới window/ tab.

https://developer.mozilla.org/en-US/docs/Web/API/Window/open#Syntax

mở trong trang tab hiện tại bằng cách sử dụng _self

<a
 href="url"
 target="_self">
   open
</a>
const autoOpenAlink = (url = ``) => {
  window.open(url, "open testing page in the same tab page");
}

mở trong một trang tab mới bằng cách sử dụng _blank

demo vue

    <div style="margin: 5px;">
        <a
            :href="url"
            @click="autoOpenAlink"
            target="_blank"
            >
            {{url}}
        </a>
    </div>

vue

    autoOpenAlink(e) {
        e.preventDefault();
        let url = this.url;
        window.open(url, "iframe testing page");
    },

Bạn không thể biết tên của cửa sổ hiện tại. Tốt hơn nên làm theo lời khuyên từ câu trả lời năm 2011 này và sử dụng tên _elf đặc biệt.
Quentin

Ví dụ đầu tiên của bạn là sai. _blank rõ ràng là một cửa sổ hoặc tab mới chưa được đặt tên .
Quentin

không có gì! nếu tôi đặt _elf, nó sẽ mở trong trang hiện tại có hại cho tôi, tôi chỉ cần một trang mới.
xgqfrms

Câu hỏi không phải là về những gì bạn cần! Nếu bạn muốn trả lời một câu hỏi về những gì bạn cần, sau đó tìm một câu hỏi yêu cầu điều đó.
Quentin
Khi sử dụng trang web của chúng tôi, bạn xác nhận rằng bạn đã đọc và hiểu Chính sách cookieChính sách bảo mật của chúng tôi.
Licensed under cc by-sa 3.0 with attribution required.