Mở trang trong tab mới bằng cách sử dụng javascript window.open (elementName.elementValue) trong thẻ neo

Question

Tôi đã kiểm tra tấn ví dụ trong vài ngày qua, nhưng vẫn không thể tìm thấy câu trả lời cho tình trạng khó xử của tôi. Để tôi giải thích tình trạng tiến thoái lưỡng nan của tôi trước tiên, tôi sẽ cho bạn thấy một ví dụ về thứ tôi làm việc, sau đó giải thích cách tôi muốn nó hoạt động (nhưng dường như không thể đạt được).

này hoạt động:

<form> 
<select name="url"> 
    <option selected="selected" value=""> Choose Donation Amount </option> 
    <option value="http://www.url1.com">URL#1</option> 
    <option value="http://www.url2.com">URL#2</option> 
    <option value="http://www.url3.com">URL#3</option> 
    <option value="http://www.url4.com">URL#4</option> 
    <option value="http://www.url5.com">URL#5</option> 
    <option value="http://www.url6.com">URL#6</option> 
</select> 
<input type="submit" value="Submit" onclick="if (url.value) window.open(url.value);" /> 
</form> 

Nhưng những gì tôi muốn làm là nắm bắt được lựa chọn và mở URL sử dụng một thẻ neo (chứ không phải đầu vào [loại "submit"]), một cái gì đó như thế này (để thay thẻ đầu vào trước thẻ biểu mẫu đóng):

<a href="javascript:void(if (url.value) window.open(url.value));" target="_blank">Submit</a> 

Dòng trên không hoạt động và tôi không thể tìm ra cách tạo biểu mẫu chính xác. Cứu giúp?

Tôi biết điều này có vẻ không hợp lý, đặc biệt là vì tôi đã làm việc bằng nút gửi nhưng cũng không thực tế để giải thích chính xác lý do tôi không muốn sử dụng đầu vào hoặc loại nút = "gửi ", hoặc PHP. Xin vui lòng, nó thực sự cần phải được javascript nội tuyến trong một thẻ neo. Thanks.s :-)

Answer 1

Thêm hình thức của bạn name thuộc tính như:

<form name="form"> 

... và sau đó thử nó như thế:

<a href="" onclick="window.open(form.url.value, 'windowName'); return false" target="_blank">Submit</a> 

Có một example làm việc.

Answer 2

này đã làm việc cho đến nay, mặc dù nó là dài

<a href="javascript:void((function(){ val=document.getElementsByName('url')[0].value; if(val) window.open(val)})())">click</a>

Answer 3

Tôi không biết lý do tại sao bạn phải sử dụng biểu mẫu nếu bạn chỉ muốn mở một URL trong khi lựa chọn một lựa chọn. Đọc mã bên dưới:

<select name="url" onchange="window.open(this.options[this.selectedIndex].value,'_blank')"> 

Tính năng này hoạt động tốt trên mọi trình duyệt Ngay cả trên IE5.

Answer 4

Bạn có thể quên sử dụng JavaScript vì trình duyệt kiểm soát xem nó có mở trong tab mới hay không. lựa chọn tốt nhất của bạn là để làm một cái gì đó như sau thay vì:

<form action="http://www.yoursite.com/dosomething" method="get" target="_blank"> 
    <input name="dynamicParam1" type="text"/> 
    <input name="dynamicParam2" type="text" /> 
    <input type="submit" value="submit" /> 
</form> 

này sẽ luôn mở trong một tab mới bất kể là trình duyệt một khách hàng sử dụng do thuộc tính target="_blank".

Nếu tất cả bạn cần là để chuyển hướng không có tham số động bạn có thể sử dụng một liên kết với thuộc tính target="_blank":

<a href="http://www.youresite.com" target="_blank">redirect</a> 

Answer 5

Chúng tôi cũng đã có một yêu cầu tương tự. Chúng tôi muốn tạo url href từ phía máy chủ bằng cách sử dụng cuộc gọi ajax khi người dùng nhấp vào nó. sau khi thực hiện rất nhiều tìm kiếm, chúng tôi phát hiện ra rằng nó thực sự được kiểm soát bởi trình duyệt. Trong chrome, trang mới được mở sẽ mở ra dưới dạng cửa sổ bật lên và nó bị chặn bởi trình chặn cửa sổ bật lên. Hầu hết người dùng ứng dụng của chúng tôi đều bị nhầm lẫn bởi hành vi đó. Đây là cách giải quyết mà chúng tôi đã sử dụng. Hy vọng điều này sẽ giúp một người có vấn đề tương tự.

Chúng tôi có thể có một liên kết thông thường trỏ đến trang web thực tế mà chúng tôi có trong trang web của chúng tôi có tên là LandingPage.html.Chúng tôi phải đặt mục tiêu thành "_blank" để mở cửa sổ trong cùng một tab trình duyệt.

<a href="LandingPage.html" id="fakeLink" target="_blank">Click to open google in the same browser window</a> 

Chúng tôi sau đó được đính kèm vào sự kiện nhấp chuột của phần tử neo FakeLink.

$('#fakeLink').click(function(){ 
     $.ajax({ 
      url: "" 
     }).done(function() { 
      localStorage.setItem('url', 'https://www.google.lk'); 
     }); 
    }); 

Chúng tôi có thể thực hiện cuộc gọi ajax và truy xuất url được tạo động từ máy chủ. sau đó chúng ta có thể thêm url đó vào localstorage.

Trang đích có thể có văn bản để chỉ ra cho người dùng rằng họ sẽ được chuyển hướng trong một giây. "Bạn sẽ được chuyển hướng đến google sau 1 giây".

Trong trang đích, chúng tôi có thể có thời gian chờ và bên trong chức năng đó, chúng tôi có thể sử dụng window.location để chuyển hướng người dùng đến trang thực tế.

setTimeout(function(){ 
     window.location.assign(localStorage.getItem('url')); 
    }, 1000); 

Hy vọng điều này sẽ hữu ích, tất cả các trình duyệt, tôi chỉ kiểm tra trong IE 10 và Chrome vì chúng tôi không sử dụng bất kỳ thứ gì liên quan đến trình duyệt.