javascript - किसी अन्य वेबपेज पर कैसे पुनर्निर्देशित किया जा सकता है?




jquery redirect (20)

मैं उपयोगकर्ता को एक पृष्ठ से दूसरे या jQuery के शुद्ध जावास्क्रिप्ट का उपयोग कैसे कर सकता हूं?


यदि आप जो करने की कोशिश कर रहे हैं, तो इसमें थोड़ा अधिक वर्णनात्मक होगा। यदि आप पेजित डेटा उत्पन्न करने का प्रयास कर रहे हैं, तो आप यह कैसे करते हैं इसमें कुछ विकल्प हैं। आप प्रत्येक पृष्ठ के लिए अलग-अलग लिंक जेनरेट कर सकते हैं जिसे आप सीधे प्राप्त करने में सक्षम होना चाहते हैं।

<a href='/path-to-page?page=1' class='pager-link'>1</a>
<a href='/path-to-page?page=2' class='pager-link'>2</a>
<span class='pager-link current-page'>3</a>
...

ध्यान दें कि वर्तमान पृष्ठ को उदाहरण में कोड में और सीएसएस के साथ अलग तरीके से संभाला जाता है।

यदि आप चाहते हैं कि paged डेटा को AJAX के माध्यम से बदला जाए, तो यह वह जगह है जहां jQuery अंदर आ जाएगा। आप क्या करेंगे, एक अलग पृष्ठ से संबंधित प्रत्येक एंकर टैग के लिए एक क्लिक हैंडलर जोड़ें। यह क्लिक हैंडलर कुछ jQuery कोड को लागू करेगा जो कि जाता है और AJAX के माध्यम से अगले पृष्ठ को प्राप्त करता है और नए डेटा के साथ तालिका को अपडेट करता है। नीचे दिया गया उदाहरण यह मानता है कि आपके पास एक वेब सेवा है जो नए पेज डेटा को रिटर्न देती है।

$(document).ready( function() {
    $('a.pager-link').click( function() {
        var page = $(this).attr('href').split(/\?/)[1];
        $.ajax({
            type: 'POST',
            url: '/path-to-service',
            data: page,
            success: function(content) {
               $('#myTable').html(content);  // replace
            }
        });
        return false; // to stop link
    });
});

var url = 'asdf.html';
window.location.href = url;

जावास्क्रिप्ट और jQuery में हम एक पृष्ठ को दूसरे पेज पर रीडायरेक्ट करने के लिए निम्न कोड का उपयोग कर सकते हैं:

window.location.href="http://google.com";
window.location.replace("page1.html");

पहले ठीक से लिखिए आप किसी अन्य लिंक के लिए अपने एप्लिकेशन से किसी अन्य लिंक के लिए एक एप्लिकेशन के भीतर नेविगेट करना चाहते हैं। यहां कोड है:

window.location.href = "http://www.google.com";

और अगर आप अपने आवेदन के भीतर पृष्ठों को नेविगेट करना चाहते हैं तो मेरे पास कोड भी है, यदि आप चाहते हैं।


इसलिए, सवाल यह है कि कैसे एक रीडायरेक्ट पृष्ठ बनाने के लिए, और कैसे एक वेबसाइट पर पुनर्निर्देशित नहीं है?

आपको इसके लिए जावास्क्रिप्ट का उपयोग करना होगा। यहाँ कुछ छोटे कोड है जो एक गतिशील पुनर्निर्देशित पेज बनाएगा।

<script>
    var url = window.location.search.split('url=')[1]; // Get the URL after ?url=
    if( url ) window.location.replace(url);
</script>

तो कहते हैं कि आप इस स्निपेट को अपनी वेबसाइट पर एक redirect/index.html फ़ाइल में डालते हैं, तो आप इसे इसी तरह इस्तेमाल कर सकते हैं।

http://www.mywebsite.com/redirect?url=http://.com

और अगर आप उस लिंक पर जाएंगे तो यह आपको स्वतः स्टैकवॉयरफ्लो.कॉम पर रीडायरेक्ट कर देगा।

प्रलेखन के लिए लिंक

और इसी तरह आप जावास्क्रिप्ट के साथ सरल रीडायरेक्ट पृष्ठ बनाते हैं

संपादित करें:

नोट करने के लिए एक बात भी है। मैंने window.location.replace को जोड़ दिया है। स्थान। मेरे कोड में जगह है क्योंकि मुझे लगता है कि यह एक रीडायरेक्ट पृष्ठ को ठीक करता है, लेकिन आपको पता होना चाहिए कि जब window.location.replace का उपयोग किया जाता है और आप पुनः निर्देशित हो जाते हैं, जब आप अपने ब्राउज़र में वापस बटन दबाते हैं रीडायरेक्ट पृष्ठ पर वापस आ गया, और इससे पहले पृष्ठ पर वापस जाएंगे, इस छोटी डेमो चीज़ पर एक नज़र डालें

उदाहरण:

प्रक्रिया: स्टोर होम => पृष्ठ को google => Google पर रीडायरेक्ट करें

जब Google पर: google => ब्राउज़र में वापस बटन => स्टोर होम

इसलिए, यदि यह आपकी ज़रूरतों के अनुरूप है तो सब कुछ ठीक होना चाहिए। यदि आप ब्राउज़र इतिहास में रीडायरेक्ट पृष्ठ को शामिल करना चाहते हैं तो इसे बदलें

if( url ) window.location.replace(url);

साथ में

if( url ) window.location.href = url;

आप jQuery के बिना ऐसा कर सकते हैं:

window.location = "http://yourdomain.com";

और अगर आप केवल jQuery चाहते हैं तो आप ऐसा कर सकते हैं:

$jq(window).attr("location","http://yourdomain.com");

ऐसा करने के तीन मुख्य उपाय हैं,

window.location.href='blaah.com';
window.location.assign('blaah.com');

तथा...

window.location.replace('blaah.com');

पिछले एक सबसे अच्छा है, एक पारंपरिक रीडायरेक्ट के लिए, क्योंकि यह आपके खोज इतिहास में पुनर्निर्देशित होने से पहले आपके द्वारा चलाए गए पृष्ठ को नहीं बचा पाएगा। हालांकि, अगर आप जावास्क्रिप्ट के साथ एक टैब खोलना चाहते हैं, तो आप इसके बाद के संस्करण में से कोई भी उपयोग कर सकते हैं। 1

संपादित करें: window उपसर्ग वैकल्पिक है।


चेतावनी: यह उत्तर केवल संभव समाधान के रूप में प्रदान किया गया है; यह स्पष्ट रूप से सबसे अच्छा समाधान नहीं है, क्योंकि यह jQuery की आवश्यकता है। इसके बजाय, शुद्ध जावास्क्रिप्ट समाधान पसंद करते हैं।

$(location).attr('href', 'http://.com')


यहां एक समय-विलंब पुनर्निर्देशन है। आप चाहते हैं कि आप देरी समय सेट कर सकते हैं:

<!doctype html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>Your Document Title</title>
    <script type="text/javascript">
        function delayer(delay) {
            onLoad = setTimeout('window.location.href = "http://www.google.com/"', delay);
        }
    </script>
</head>

<body>
    <script>
        delayer(8000)
    </script>
    <div>You will be redirected in 8 seconds!</div>
</body>

</html>

मुझे अभी तक एक और नई jQuery विधि के साथ इस हास्यास्पद अद्यतन करने के लिए किया था:

var url = 'http://www.fiftywaystoleaveyourlocation.com';
$(location).prop('href', url);

सिर्फ एक पृष्ठ पर पुनर्निर्देशित करने के लिए:

  window.location.href = "/destination.html";

या यदि आपको विलंब की आवश्यकता है:

setTimeout(function () {
  window.location.href = "/destination.html";
}, 2000);   // Time in milliseconds

jQuery आपको आसानी से एक वेब पेज से तत्वों को चुनने की अनुमति देता है आप एक पृष्ठ में कुछ भी पा सकते हैं और फिर विशेष प्रभावों को जोड़ने, उपयोगकर्ता के कार्यों पर प्रतिक्रिया देने, या आपके द्वारा चुने गए तत्व के अंदर और बाहर की सामग्री दिखाने या छुपाए जाने के लिए jQuery का उपयोग कर सकते हैं। ये सभी कार्य एक तत्व का चयन करने के तरीके को जानने के साथ शुरू करते हैं।

function redirect () {
    $('selection').animate({
        marginLeft: 100px; //Put some CSS animation here
    }, 500, function () {
      // OK, finished jQuery staff, let's go redirect
      window.location.href = "/destination.html";
})

कल्पना कीजिए कि किसी ने स्क्रिप्ट / प्लगइन लिखा है जो कोड की 10000 लाइनें हैं ?! ठीक है, jQuery के साथ आप इस कोड से सिर्फ एक पंक्ति या दो के साथ जुड़ सकते हैं


# एचटीएमएल पेज रीडायरेक्ट jQuery / जावास्क्रिप्ट का उपयोग करना

इस उदाहरण कोड को आज़माएं:

function YourJavaScriptFunction()
{
    var i = $('#login').val();
    if (i == 'login')
        window.location = "login.php";
    else
        window.location = "Logout.php";
}

यदि आप window.location = "www.google.co.in"; रूप में एक पूर्ण यूआरएल देना चाहते हैं window.location = "www.google.co.in";


किसी पृष्ठ को पुनर्निर्देशित करने के लिए मानक "वेनिला" जावास्क्रिप्ट तरीका:

window.location.href = 'newPage.html';

यदि आप यहां हैं क्योंकि रीडायरेक्ट करते समय आप HTTP_REFERER खो रहे हैं, तो पढ़ते रहें:

निम्न अनुभाग उन लोगों के लिए है जो कई सुरक्षित उपायों में से एक के रूप में HTTP_REFERER का इस्तेमाल करते हैं (हालांकि यह एक महान सुरक्षात्मक उपाय नहीं है)। यदि आप इंटरनेट एक्सप्लोरर 8 या उससे कम का उपयोग कर रहे हैं, तो ये वैरिएबल्स गायब हो जाते हैं जब किसी भी रूप में जावास्क्रिप्ट पेज रीडायरेक्शन (location.href, आदि) का इस्तेमाल होता है।

नीचे हम IE8 और कम के लिए एक विकल्प को लागू करने जा रहे हैं ताकि हम HTTP_REFERER खो न जाएं अन्यथा आप लगभग हमेशा केवल window.location.href उपयोग कर सकते हैं।

HTTP_REFERER (URL चिपकाने, सत्र इत्यादि) के खिलाफ परीक्षण यह कहने में सहायक हो सकता है कि कोई अनुरोध वैध है या नहीं। ( नोट: इन रेफरेर्स को काम करने के लिए / आसपास के तरीके भी हैं, जैसा कि टिप्पणियों में डूप के लिंक से लिखा गया है)

सरल क्रॉस-ब्राउज़र परीक्षण समाधान (Internet Explorer 9+ और अन्य सभी ब्राउज़रों के लिए window.location.href पर फ़ॉलबैक)

उपयोग: redirect('anotherpage.aspx');

function redirect (url) {
    var ua        = navigator.userAgent.toLowerCase(),
        isIE      = ua.indexOf('msie') !== -1,
        version   = parseInt(ua.substr(4, 2), 10);

    // Internet Explorer 8 and lower
    if (isIE && version < 9) {
        var link = document.createElement('a');
        link.href = url;
        document.body.appendChild(link);
        link.click();
    }

    // All other browsers can use the standard window.location.href (they don't lose HTTP_REFERER like Internet Explorer 8 & lower does)
    else { 
        window.location.href = url; 
    }
}

उपयोग:

// window.location
window.location.replace('http://www.example.com')
window.location.assign('http://www.example.com')
window.location.href = 'http://www.example.com'
document.location.href = '/path'

// window.history
window.history.back()
window.history.go(-1)

// window.navigate; ONLY for old versions of Internet Explorer
window.navigate('top.jsp')


// Probably no bueno
self.location = 'http://www.example.com';
top.location = 'http://www.example.com';

// jQuery
$(location).attr('href','http://www.example.com')
$(window).attr('location','http://www.example.com')
$(location).prop('href', 'http://www.example.com')

यह jQuery के साथ काम करता है:

$(window).attr("location", "http://google.fr");

जावास्क्रिप्ट:

window.location.href='www.your_url.com';
window.top.location.href='www.your_url.com';
window.location.replace('www.your_url.com');

jQuery:

var url='www.your_url.com';
$(location).attr('href',url);
$(location).prop('href',url);//instead of location you can use window


कोई भी jQuery का उपयोग करके रीडायरेक्ट नहीं करता है

jQuery आवश्यक नहीं है, और window.location.replace(...) सर्वश्रेष्ठ एक HTTP पुनर्निर्देशन अनुकरण करेगा।

window.location.replace(...) window.location.href प्रयोग करने से बेहतर है, क्योंकि replace() करता है replace() सत्र के इतिहास में मूल पृष्ठ को नहीं रखता है, जिसका अर्थ है कि उपयोगकर्ता कभी-न समाप्त होने वाले बैक-ऑन में फंस जाता है, बटन असफलता

यदि आप किसी लिंक पर क्लिक करने के लिए किसी का अनुकरण करना चाहते हैं, तो location.href उपयोग करें

यदि आप एक HTTP पुनर्निर्देशन अनुकरण करना चाहते हैं, तो location.replace उपयोग करें

उदाहरण के लिए:

// similar behavior as an HTTP redirect
window.location.replace("http://.com");

// similar behavior as clicking on a link
window.location.href = "http://.com";

ब्राउज़र आपको ब्राउज़र के पता बार में प्रदर्शित होने वाले वर्तमान यूआरएल को पुनः प्राप्त करने और बदलने के लिए कई तरीके प्रदान करता है। ये सभी विधियां स्थान ऑब्जेक्ट का उपयोग करती हैं, जो विंडो ऑब्जेक्ट की संपत्ति है। आप एक नया स्थान ऑब्जेक्ट बना सकते हैं जिसमें वर्तमान यूआरएल है।

var currentLocation = window.location;

एक यूआरएल की मूल संरचना

<protocol>//<hostname>:<port>/<pathname><search><hash>

  1. प्रोटोकॉल - प्रोटोकॉल नाम को इंटरनेट पर संसाधन तक पहुंचने के लिए उपयोग किया जाता है। (एसटीएस के बिना) या एचटीटीपीएस (एसएसएल के साथ))

  2. होस्टनाम - मेजबान नाम स्रोत को होस्ट करता है जो होस्ट को निर्दिष्ट करता है उदाहरण के लिए, www..com एक सर्वर मेजबान के नाम का उपयोग कर सेवाएं प्रदान करता है।

  3. बंदरगाह - एक पोर्ट नंबर जिसका इस्तेमाल किसी विशिष्ट प्रक्रिया को पहचानने के लिए किया जाता है, जिस पर किसी सर्वर पर आने पर इंटरनेट या अन्य नेटवर्क संदेश अग्रेषित किया जाता है

  4. पथनाम - पथ उस होस्ट के भीतर विशिष्ट संसाधन के बारे में जानकारी देता है जिसे वेब ग्राहक एक्सेस करना चाहता है उदाहरण के लिए, .com/index.html।

  5. क्वेरी - एक क्वेरी स्ट्रिंग पथ घटक का अनुसरण करती है, और ऐसी जानकारी की एक स्ट्रिंग प्रदान करती है जो संसाधन किसी उद्देश्य के लिए उपयोग कर सकती है (उदाहरण के लिए, खोज के लिए पैरामीटर या संसाधित करने के लिए डेटा के रूप में)

  6. हैश - यूआरएल के लंगर भाग में हैश चिह्न (#) शामिल है

इन स्थान वस्तु गुणों के साथ आप इन सभी यूआरएल घटकों का उपयोग कर सकते हैं

  1. हैश -सेट या एक यूआरएल के लंगर भाग देता है।
  2. होस्ट -सेट या यूआरएल के मेजबाननाम और पोर्ट देता है
  3. होस्टनाम -सेट करता है या यूआरएल के मेजबाननाम देता है
  4. href- पूरे यूआरएल सेट या रिटर्न
  5. पथ का नाम- एक यूआरएल का पथ नाम देता है या रिटर्न करता है
  6. पोर्ट -सेट करता है या सर्वर को यूआरएल के लिए उपयोग करता है पोर्ट नंबर देता है।
  7. प्रोटोकॉल -सेट या यूआरएल के प्रोटोकॉल को रिटर्न।
  8. खोज- एक यूआरएल के क्वेरी भाग को रिटर्न या रिटर्न

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

आप स्थान ऑब्जेक्ट के href प्रॉपर्टी का उपयोग कर सकते हैं।

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

स्थान वस्तु में इन तीन तरीकों भी हैं

  1. असाइन करें () - एक नया दस्तावेज़ लोड करता है
  2. पुनः लोड करें () - वर्तमान दस्तावेज़ पुनः लोड करता है।
  3. प्रतिस्थापित करें () - एक नया वाला वर्तमान दस्तावेज़ को बदल देता है

आप असाइन () का उपयोग कर सकते हैं और इस तरह अन्य पृष्ठों को रीडायरेक्ट करने के तरीकों को भी बदल सकते हैं

location.assign("http://www..com");

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

कैसे असाइन करें () और प्रतिस्थापित करें () अलग -अलग () विधि और असाइन () विधि () के बीच अंतर, यह है कि प्रतिस्थापित () दस्तावेज़ इतिहास से वर्तमान दस्तावेज़ के यूआरएल को निकालता है, इसका मतलब यह है कि इसका उपयोग करना संभव नहीं है मूल दस्तावेज़ में वापस नेविगेट करने के लिए "वापस" बटन। तो असाइन () विधि का उपयोग करें यदि आप एक नया दस्तावेज़ लोड करना चाहते हैं, और मूल दस्तावेज़ पर वापस नेविगेट करने का विकल्प देने के लिए।

आप इस तरह भी jQuery का उपयोग कर स्थान वस्तु href संपत्ति बदल सकते हैं

$(location).attr('href',url);

और इसलिए आप उपयोगकर्ता को कुछ अन्य यूआरएल पर रीडायरेक्ट कर सकते हैं।





redirect