जावास्क्रिप्ट के साथ window.location (URL) से पृष्ठ हटाए बिना हैश कैसे निकालें?

Question

मेरे पास URL है जैसे: पृष्ठ को ताज़ा किए बिना http://example.com#somethingमैं कैसे #somethingहटाऊं?

मैंने निम्नलिखित समाधान का प्रयास किया:

window.location.hash = '';

हालाँकि, यह #URL से हैश प्रतीक को नहीं हटाता है ।

Comments

क्या आप वास्तव में ऐसा करना चाहते हैं? यह एक पेज रिफ्रेश का कारण बनेगा।

— सेठ

क्या पेज रिफ्रेश किए बिना करना संभव है?

— टॉम लेहमन

यह है संभव। AJAX के इतिहास के पुस्तकालय इससे निपटते हैं। लेकिन यह आसान नहीं है, और इसे लगभग हर ब्राउज़र के लिए अलग तरह से करना पड़ता है। नहीं कुछ तुम में लाना चाहते हैं।

— गेब्रियल हर्ले

क्या एक दृश्य के अलावा "#" को छोड़ने के साथ कोई सहमति है?

— user29660

पृष्ठ को पुनः लोड किए बिना URL संशोधित करना

— PayteR

Answer 1

प्रारंभिक प्रश्न:

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

या

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

दोनों हैश या इसके बाद कुछ भी बिना यूआरएल वापस कर देंगे।

आपके संपादन के संबंध में:

किसी भी परिवर्तन से window.locationपृष्ठ ताज़ा हो जाएगा। आप window.location.hashरिफ्रेश को ट्रिगर किए बिना बदल सकते हैं (हालांकि विंडो कूद जाएगी यदि आपका हैश पेज पर आईडी से मेल खाता है), लेकिन आप हैश साइन से छुटकारा नहीं पा सकते हैं। अपना ले लो जिसके लिए बदतर है ...

सबसे ऊपर दिनांक तिथि उत्तर

यज्ञ के बिना इसे करने का सही उत्तर (या तो पूर्ण पुनः लोड करना या वहां हैश साइन को छोड़ना) नीचे है । हालांकि 2009 में मूल एक होने के संबंध में इस जवाब को छोड़ते हुए जबकि नए ब्राउज़र एपीआई का लाभ उठाने वाला सही 1.5 साल बाद दिया गया था।

Comments

यह सिर्फ सादा गलत है, आप window.location.hash को बदल सकते हैं और यह एक ताज़ा ट्रिगर नहीं करेगा।

— एवगेनी

@ ईजेनवी - यही मेरा जवाब कहता है। मैं स्पष्ट रूप से कहता हूं कि बदलते window.location.hash एक ताज़ा ट्रिगर नहीं करेगा। "आप रिफ्रेश को ट्रिगर किए बिना window.location.hash को बदल सकते हैं (हालांकि यदि विंडो आपके हैश पेज पर एक आईडी से मेल खाती है तो विंडो कूद जाएगी)"।

— गेब्रियल हर्ले

कोई पृष्ठ पुनः लोड नहीं हुआ - जो प्रश्न में है। यह उत्तर नहीं है क्योंकि इसके लिए पृष्ठ पुनः लोड करने की आवश्यकता होती है!

— Ed_

यह भी सोचें कि यह --answer

— abernier

यह ओपी सवाल का जवाब नहीं है।

— ब्रज

Answer 2

इस समस्या का समाधान आजकल पहुंच के भीतर बहुत अधिक है। एचटीएमएल 5 इतिहास एपीआई हमें वर्तमान डोमेन के भीतर किसी भी URL दिखाने के लिए स्थान पट्टी में हेरफेर करने की अनुमति देता है।

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

वर्किंग डेमो: http://jsfiddle.net/AndyE/ycmPt/show/

यह क्रोम 9, फ़ायरफ़ॉक्स 4, सफारी 5, ओपेरा 11.50 और आईई 10. में काम करता है । असमर्थित ब्राउज़रों के लिए, आप हमेशा एक सुंदर अपमानजनक स्क्रिप्ट लिख सकते हैं, जो इसका उपयोग करता है जहां उपलब्ध है:

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

तो आप हैश प्रतीक से छुटकारा पा सकते हैं, बस सभी ब्राउज़रों में नहीं - अभी तक।

_{नोट: यदि आप ब्राउज़र इतिहास में वर्तमान पृष्ठ को बदलना चाहते हैं, तो replaceState()इसके बजाय उपयोग करें pushState()।}

Comments

इस पंक्ति का उपयोग यह सुनिश्चित करने के लिए करें कि आप क्वेरी स्ट्रिंग नहीं खोते हैं: history.pushState ("", document.title, window.location.pathname + window.location.search);

— फिल कुलक

@Phil: इस ओर इशारा करने के लिए धन्यवाद, मैंने तदनुसार उत्तर अपडेट कर दिया है। मैं बहुत सुंदर URL का उपयोग करने के लिए अभ्यस्त हूं।

— एंडी ई

IE के पुराने संस्करणों के लिए, ऐसा लगता है कि आपको document.body के बजाय document.documentElement का उपयोग करने की आवश्यकता है। इस उत्तर को देखें stackoverflow.com/a/2717272/359048

— jasonmcclurg

मेरा सुझाव है कि ब्राउजर के इतिहास में एक अतिरिक्त प्रविष्टि नहीं बनाने के लिए, pushState के बजाय रिप्लेसस्टेट का उपयोग करें।

— निको

@santiagoarizti: आप सही कह रहे हैं, मैं अभी उसी निष्कर्ष पर आया हूं। मैंने अपने द्वारा लिखे गए कोड (7 साल पहले!) का ठीक से निरीक्षण नहीं किया और याद किया कि मैं हैश हटाते समय बटन की स्थिति को भी देख रहा था। चूँकि आप हैश को मैन्युअल रूप से बदल रहे हैं, आप हमेशा अपने आप को इवेंट ट्रिगर कर सकते हैं, मुझे लगता है।

— एंडी ई

Answer 3

(बहुत सारे उत्तर बेमानी और पुराने हैं।) अब इसका सबसे अच्छा समाधान है:

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

Comments

history.pushState(null, null, ' ')यदि आप इतिहास को संरक्षित करना चाहते हैं तो इसके बजाय उपयोग करें ।

— निचेजौ

यह समझाने के लिए उपयोगी हो सकता है कि आखिरकार और मापदंडों के nullलिए क्या गुजर रहा है। statetitle

— वी। रुबिनाटी

इस के साथ एक समस्या है, और बाकी, यह है कि यह onhashchange ट्रिगर नहीं करता है, भले ही हैश अब खाली है जब यह पहले नहीं था।

— कर्टिस

टाइपस्क्रिप्ट में, दूसरे पैरामीटर के लिए नल की अनुमति नहीं है क्योंकि कमांड एक स्ट्रिंग लेता है। मोज़िला खाली स्ट्रिंग की सिफारिश करता है।

— कर्टिस

Answer 4

सरल और सुरुचिपूर्ण:

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

Comments

स्लैश के बजाय डॉट का उपयोग करें यदि आप एक ही डायरेक्टरी में रहना चाहते हैं

— vahanpwns

के .बजाय उपयोग करने के लिए, @vahanpwns नोट के रूप में जवाब अद्यतन करें /। का उपयोग करते हुए /परिवर्तन रूट पथ के लिए यूआरएल।

— इसहाक ग्रेगसन

इस उत्तर के लिए धन्यवाद, मैं history.replaceState({}, document.title, location.href.substr(0, location.href.length-location.hash.length));अपने उपयोग के मामले के लिए संशोधित ।

— स्कॉट जुंगविर्थ

यह url क्वेरी को संरक्षित नहीं करता है।

— व्लादिस्लाव कोस्टेंको

मेरा उपयोग-मामला भी धक्का के बजाय बदलने के लिए था, लेकिन यह मेरे लिए अधिक समझ में आता है:history.replaceState(null, document.title, location.pathname + location.search);

— एमडीएमवर

Answer 5

हैश को निकालने के लिए, आप इस फ़ंक्शन का उपयोग करने का प्रयास कर सकते हैं

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

Answer 6

यह ट्रेलिंग हैश को भी हटा देगा। जैसे: http://test.com/123#abc -> http://test.com/123

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

Comments

यह URL में मौजूद किसी भी प्रश्न को हटाता है :(

— kevgathuku

@kevgathuku आप उन्हें लोकेशन, खोज के साथ वापस जोड़ सकते हैं, जैसे: `window.history.pushState ('', '/', window.location.pathname + window.location.search) '

— क्रिस गनवार्डन

Answer 7

निम्नलिखित के बारे में कैसे?

window.location.hash=' '

कृपया ध्यान दें कि हैश को एक सिंगल स्पेस में सेट किया जा रहा है, न कि खाली स्ट्रिंग को।

---

अमान्य एंकर को हैश सेट करने से रिफ्रेश भी नहीं होता है। जैसे कि,

window.location.hash='invalidtag'

लेकिन, मैं भ्रामक होने के लिए उपरोक्त समाधान ढूंढता हूं। यह इंगित करने के लिए प्रतीत होता है कि दिए गए नाम के साथ दिए गए स्थान पर एक लंगर है, हालांकि एक नहीं है। उसी समय, खाली स्ट्रिंग का उपयोग करने से पृष्ठ शीर्ष पर चला जाता है जो कई बार अस्वीकार्य हो सकता है। एक स्थान का उपयोग करना यह भी सुनिश्चित करता है कि जब भी URL को कॉपी और बुकमार्क किया जाए और फिर से देखा जाए, तो पृष्ठ आमतौर पर सबसे ऊपर होगा और अंतरिक्ष को नजरअंदाज कर दिया जाएगा।

और, हे, StackOverflow पर यह मेरा पहला जवाब है। आशा है कि कोई इसे उपयोगी पाता है और यह सामुदायिक मानकों से मेल खाता है।

Comments

हैश को व्हॉट्सएप पर सेट करना अभी भी # URL के अंत में रहता है, मुझे लगता है कि इसे पूरी तरह से हटाना लक्ष्य है।

— Mahemoff

यह URL के अंत में हैश का निशान लगाता है। सवाल यह है कि इसे कैसे हटाया जाए।

— गुरमीत सिंह

हाँ हम हैश स्ट्रिंग के साथ # कैसे निकाल सकते हैं।

— भाविन थुम्मर

Answer 8

आप इसे नीचे के रूप में कर सकते हैं:

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

Comments

तारांकित जवाब मेरे लिए किसी भी मामले में काम नहीं करता था, लेकिन इसने किया। धन्यवाद!

— देव अप

Answer 9

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

Comments

हालांकि यह कोड प्रश्न का उत्तर दे सकता है, लेकिन यह कोड क्यों और / या इस बारे में अतिरिक्त संदर्भ प्रदान करता है कि यह प्रश्न इसके दीर्घकालिक मूल्य में सुधार करता है।

— रोलस्टूफ़्लोरहेयर

Answer 10

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

इस कोड को हेड सेक्शन पर रखें

Answer 11

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

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

Answer 12

मुझे लगता है, यह अधिक सुरक्षित होगा

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

Answer 13

निम्नलिखित का प्रयास करें:

window.history.back(1);

Comments

यदि उपयोगकर्ता सीधे हैश सहित URL पर आ गया है तो यह इस सवाल का जवाब नहीं देता है।

— 2

जब आप अभी पिछले पृष्ठ का लिंक बनाना चाहते हैं तो यह ट्रिक बहुत उपयोगी है, लेकिन लिंक js फाइलों के गुच्छा में छिपा हुआ है।

— वैलिडफ्रोएम

ठीक वही जो मेरे द्वारा खोजा जा रहा था। यह पूरी तरह से मेरे वेब ऐप द्वारा बनाए गए हैशटैग को हटाने के लिए पूरी तरह से काम करता है ताकि एक जावास्क्रिप्ट फ़ंक्शन द्वारा लौटाए गए मान का उपभोग किया जा सके।

— user278859

Answer 14

यहाँ href का उपयोग करके स्थान बदलने और स्क्रॉल किए बिना हैश को साफ़ करने का एक और उपाय है।

जादू का समाधान यहां बताया गया है । यहाँ चश्मा ।

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

नोट: प्रस्तावित API अब व्हाट्सएप HTML लिविंग स्टैंडर्ड का हिस्सा है

Answer 15

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

Answer 16

आप हैश को नल के साथ बदल सकते हैं

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

Comments

सवाल पूछता है "पृष्ठ को ताज़ा किए बिना", लेकिन यह विधि पृष्ठ को ताज़ा करती है। आपको अपने उत्तर में इस तथ्य पर ध्यान देना चाहिए, इसलिए हम सभी को यह जानने में अपना समय बर्बाद करने की आवश्यकता नहीं है कि आप एक अलग प्रश्न का उत्तर दे रहे हैं, जिसे हम वास्तव में यहाँ उत्तर देने की कोशिश कर रहे हैं।

— व्लादिमीर कोर्निआ

यह पेज को रिफ्रेश नहीं करता है।

— सिप्रियन