Làm cách nào để xóa hàm băm khỏi window.location (URL) bằng JavaScript mà không cần làm mới trang?

Tôi có URL như : http://example.com#something, làm cách nào để xóa trang #somethingmà không khiến trang bị làm mới?

Tôi đã thử giải pháp sau:

window.location.hash = '';

Tuy nhiên, điều này không xóa biểu tượng băm #khỏi URL.

Câu hỏi ban đầu:

window.location.href.substr(0, window.location.href.indexOf('#'))

hoặc là

window.location.href.split('#')[0]

cả hai sẽ trả về URL mà không cần băm hoặc bất cứ điều gì sau nó.

Liên quan đến chỉnh sửa của bạn:

Mọi thay đổi window.locationsẽ kích hoạt làm mới trang. Bạn có thể thay đổi window.location.hashmà không kích hoạt làm mới (mặc dù cửa sổ sẽ nhảy nếu hàm băm của bạn khớp với id trên trang), nhưng bạn không thể thoát khỏi dấu băm. Hãy lựa chọn cái nào tệ hơn ...

TRẢ LỜI TUYỆT VỜI NHẤT

Câu trả lời đúng về cách thực hiện mà không phải hy sinh (tải lại đầy đủ hoặc để lại dấu băm ở đó) ở đây . Để lại câu trả lời này ở đây mặc dù liên quan đến việc là bản gốc vào năm 2009 trong khi câu trả lời đúng sử dụng API trình duyệt mới đã được đưa ra 1,5 năm sau đó.

Giải quyết vấn đề này là nhiều hơn trong tầm tay ngày nay. Các HTML5 History API cho phép chúng ta thao tác thanh địa chỉ để hiển thị bất kỳ URL trong lĩnh vực hiện tại.

function removeHash () { 
    history.pushState("", document.title, window.location.pathname
                                                       + window.location.search);
}

Bản demo hoạt động: http://jsfiddle.net/AndyE/ycmPt/show/

Điều này hoạt động trong Chrome 9, Firefox 4, Safari 5, Opera 11.50 và trong IE 10. Đối với các trình duyệt không được hỗ trợ, bạn luôn có thể viết một tập lệnh xuống cấp duyên dáng sử dụng nó khi có sẵn:

function removeHash () { 
    var scrollV, scrollH, loc = window.location;
    if ("pushState" in history)
        history.pushState("", document.title, loc.pathname + loc.search);
    else {
        // Prevent scrolling by storing the page's current scroll offset
        scrollV = document.body.scrollTop;
        scrollH = document.body.scrollLeft;

        loc.hash = "";

        // Restore the scroll offset, should be flicker free
        document.body.scrollTop = scrollV;
        document.body.scrollLeft = scrollH;
    }
}

Vì vậy, bạn có thể thoát khỏi biểu tượng băm, chỉ trong tất cả các trình duyệt - chưa.

_{Lưu ý: nếu bạn muốn thay thế trang hiện tại trong lịch sử trình duyệt, hãy sử dụng replaceState()thay vì pushState().}

(Quá nhiều câu trả lời là dư thừa và lỗi thời.) Giải pháp tốt nhất hiện nay là:

history.replaceState(null, null, ' ');

Đơn giản và thanh lịch:

history.replaceState({}, document.title, ".");  // replace / with . to keep url

Để xóa hàm băm, bạn có thể thử sử dụng chức năng này

function remove_hash_from_url()
{
    var uri = window.location.toString();
    if (uri.indexOf("#") > 0) {
        var clean_uri = uri.substring(0, uri.indexOf("#"));
        window.history.replaceState({}, document.title, clean_uri);
    }
}

Điều này sẽ loại bỏ băm trailing là tốt. ví dụ: http://test.com/123#abc -> http://test.com/123

if(window.history.pushState) {
    window.history.pushState('', '/', window.location.pathname)
} else {
    window.location.hash = '';
}

Làm thế nào về sau đây?

window.location.hash=' '

Xin lưu ý rằng đang đặt băm thành một khoảng trắng và không phải là một chuỗi trống.

Đặt băm thành một neo không hợp lệ cũng không gây ra làm mới. Nhu la,

window.location.hash='invalidtag'

Nhưng, tôi thấy giải pháp trên là sai lệch. Điều này dường như chỉ ra rằng có một mỏ neo trên vị trí nhất định với tên đã cho mặc dù không có cái nào. Đồng thời, việc sử dụng một chuỗi trống khiến trang di chuyển lên đầu có thể không được chấp nhận. Sử dụng một khoảng trắng cũng đảm bảo rằng bất cứ khi nào URL được sao chép và đánh dấu và truy cập lại, trang thường sẽ ở trên cùng và không gian sẽ bị bỏ qua.

Và, này, đây là câu trả lời đầu tiên của tôi trên StackOverflow. Hy vọng ai đó thấy nó hữu ích và nó phù hợp với các tiêu chuẩn cộng đồng.

Bạn có thể làm như dưới đây:

history.replaceState({}, document.title, window.location.href.split('#')[0]);

const url = new URL(window.location);
url.hash = '';
history.replaceState(null, document.title, url);

<script type="text/javascript">
var uri = window.location.toString();
if (uri.indexOf("?") > 0) {
    var clean_uri = uri.substring(0, uri.indexOf("?"));
    window.history.replaceState({}, document.title, clean_uri);
}
</script>

đặt mã này vào phần đầu

function removeLocationHash(){
    var noHashURL = window.location.href.replace(/#.*$/, '');
    window.history.replaceState('', document.title, noHashURL) 
}

window.addEventListener("load", function(){
    removeLocationHash();
});

Tôi nghĩ rằng, nó sẽ an toàn hơn

if (window.history) {
    window.history.pushState('', document.title, window.location.href.replace(window.location.hash, ''));
} else {
    window.location.hash = '';
}

Hãy thử như sau:

window.history.back(1);

Đây là một giải pháp khác để thay đổi vị trí bằng cách sử dụng href và xóa hàm băm mà không cần cuộn.

Giải pháp kỳ diệu được giải thích ở đây . Thông số kỹ thuật ở đây .

const hash = window.location.hash;
history.scrollRestoration = 'manual';
window.location.href = hash;    
history.pushState('', document.title, window.location.pathname);

LƯU Ý: API được đề xuất hiện là một phần của Tiêu chuẩn sống WhatWG HTML

  $(window).on('hashchange', function (e) {
        history.replaceState("", document.title, e.originalEvent.oldURL);
    });

Bạn có thể thay thế hàm băm bằng null

var urlWithoutHash = document.location.href.replace(location.hash , "" );