Thay đổi URL và chuyển hướng bằng jQuery


132

Tôi có một số mã như thế này,

<form id="abc">
  <input type="text" id="txt" />
</form>

và bây giờ tôi muốn chuyển hướng như thế này,

var temp = $("#txt").val();
url = "http://example.com/" + temp;
window.location.replace(url);
// or window.location(url);

Có cách nào trong jQuery để giải quyết điều này không? Nó vẫn cho tôi có url = http://example.com.


Cảm ơn tất cả các bạn! Bây giờ tôi vẫn không biết sự khác biệt giữa window.location và window.location.replace. Trong ví dụ của tôi, tôi chỉ cần đăng url lên trang của mình như thế: abc.com/abc để có được abc để tìm kiếm trong cơ sở dữ liệu của tôi với abc là những gì người dùng nhập vào và nhấn enter hoặc nút nhưng họ luôn trả về abc.com ? name = abc vì vậy tôi nghĩ rằng tôi có thể kích hoạt trong việc gửi sự kiện để chuyển hướng và thay đổi url của mình thành những gì tôi muốn nhưng họ vẫn không làm gì cả. Nhân tiện, cảm ơn bạn một lần nữa!
gacon

3
Tôi đã giải thích sự khác biệt giữa window.location và window.location.replace tại đây: stackoverflow.com/questions/846954/
mẹo

Câu trả lời:


343

Như đã đề cập trong các câu trả lời khác, bạn không cần jQuery để làm điều này; bạn chỉ có thể sử dụng các thuộc tính tiêu chuẩn.

Tuy nhiên, dường như bạn không biết sự khác biệt giữa window.location.replace(url)window.location = url.

  1. window.location.replace(url)thay thế vị trí hiện tại trong thanh địa chỉ bằng một địa chỉ mới. Trang đang gọi chức năng này sẽ không được đưa vào lịch sử trình duyệt. Do đó, trên vị trí mới, nhấp vào nút quay lại trong trình duyệt của bạn sẽ khiến bạn quay lại trang bạn đang xem trước khi bạn truy cập tài liệu có chứa JavaScript chuyển hướng.
  2. window.location = urlchuyển hướng đến vị trí mới. Trên trang mới này, nút quay lại trong trình duyệt của bạn sẽ trỏ đến trang gốc có chứa JavaScript chuyển hướng.

Tất nhiên, cả hai đều có trường hợp sử dụng của họ, nhưng có vẻ như trong trường hợp này bạn nên gắn bó với cái sau.

PS: Có lẽ bạn đã quên hai dấu gạch chéo sau http:dòng 2 của JavaScript:

url = "http://abc.com/" + temp;

5
Nhưng để rất chính xác, bạn nên đặt window.location.href thay vì window.location. Mặc dù hiện tại cả hai đều hoạt động, cái sau là một đối tượng (và tất nhiên không được hỗ trợ để gán một chuỗi trong phiên bản IE cổ ...)
Victor

1
@Victor [cần dẫn nguồn]
Mathias Bynens

1
@Victor Đó không liệt kê bất kỳ phiên bản cổ IE, nơi nghỉ này trong comment @ bobince là đúng:. Stackoverflow.com/a/10016109/96656#comment18225061_10016109
Mathias Bynens

Trừ đi 1. Không đủ jQuery
VarunAgw

41

nói cho bạn biết sự thật, tôi vẫn không nhận được những gì bạn cần, nhưng

window.location(url);

nên là

window.location = url;

một tìm kiếm trên tham chiếu window.location sẽ cho bạn biết điều đó.


18

jQuery không có tùy chọn cho việc này, cũng không nên có tùy chọn này. Đây là javascript hoàn toàn hợp lệ và không có lý do gì để jQuery cung cấp các hàm bao bọc cho việc này.

jQuery chỉ là một thư viện trên đầu trang javascript, ngay cả khi bạn sử dụng jQuery, bạn vẫn có thể sử dụng javascript bình thường.

Btw window.location không phải là một hàm mà là một thuộc tính mà bạn nên đặt như thế này:

window.location = url;

bỏ phiếu cho yêu cầu jQuery không có phương pháp cho việc này (mặc dù đó là quá mức cần thiết và không nên được đề xuất) $ jq (window) .attr ("location", " yourdomain.com" ); hoặc $ (vị trí) .attr ('href', url);
cướp

9
Upvote để hoàn tác downvote đó. Phản hồi của Pim có thể dễ dàng đọc là "không có phương pháp cụ thể nào trong jQuery cho việc này." Để downvote về ngữ nghĩa từ vựng là một lạm dụng của đặc quyền đó.
Thiên thần Nigel

Được nâng cấp bởi vì bạn biết ... đúng là "không có phương pháp cụ thể nào trong jQuery cho việc này.", Tại sao bạn muốn có một giải pháp xấu như: $ jq (window) .attr ("location", "yourdomain. com "); khi bạn có thể có một cái gì đó như window.location = url;
Rodolfo Abarca

11
var temp="/yourapp/";
$(location).attr('href','http://abcd.com'+temp);

Hãy thử điều này ... được sử dụng như là một thay thế


3

Thử cái này...

$("#abc").attr("action", "/yourapp/" + temp).submit();

Nó có nghĩa là gì

Tìm một biểu mẫu với id"abc", thay đổi attributetên "hành động" và sau đó gửi nó ...

Điều này làm việc cho tôi ... !!!


1
lol, đó là một số S vui! Tôi thích ý tưởng mặc dù. Điểm cho sự sáng tạo!
Eric Bishard

-2

bạn có thể làm nó đơn giản hơn mà không cần jquery

location = "https://example.com/" + txt.value


Nó không hoạt động, và tôi không thể thấy nó có thể như thế nào. vị trí không phải là một toàn cầu. cửa sổ. Vị trí là. chỉnh sửa: Yep đã xác minh. Nó không hoạt động, ít nhất là không trong chrome. Xem xét cập nhật ví dụ của bạn lên window.location
Shayne

Lạ - trong chrome của tôi, firefox, safari nó hoạt động - vị trí là tài sản toàn cầu - ví dụ: khi tôi gõ vào bảng điều khiển chrome: location = 'https://google.com'sau đó nó thay đổi trang - bạn có thử trên các trình duyệt khác không?
Kamil Kiełczewski

@Shayne khi bạn gõ thisthis.locationtrong bảng điều khiển - bạn thấy gì?
Kamil Kiełczewski

this.location chỉ hoạt động khi "this" đang đề cập đến cửa sổ. Mà hiếm khi sẽ là trường hợp. Rõ ràng luôn tốt hơn Ngẫu nhiên, đặc biệt nếu bạn không muốn ngạc nhiên khi mã của bạn không thể mang theo hoặc có thể tái sử dụng
Shayne

Có bạn đúng - tuy nhiên tôi tự hỏi: tại sao trong trình duyệt của bạn thiskhông đề cập đến windowđối tượng (và đoạn trích trên không hoạt động)? (trong bối cảnh toàn cầu của trình duyệt, nó nên được đặt thành đối tượng windows )
Kamil Kiełczewski 17/07/19
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.