Tuesday 15 May 2012

javascript - Navigating in a single page using Jquery -


मेरे पास दो html पृष्ठ हैं I एक Login.html है और दूसरा index.html है जब भी उपयोगकर्ता लॉगिन बटन पर क्लिक करता है, मैं index.html पर जाने के लिए चाहता हूँ (लेकिन एक सामान्य href लिंकिंग के रूप में नहीं)।

सूचकांक पृष्ठ लॉगिन के कोड के अंदर होना चाहिए । Html भी .. इसकी एक एकल पृष्ठ नेविगेशन की तरह।

क्या कोई ऐसा प्लगइन है जो समान करता है?

मैंने इसे करने की कोशिश की

  & lt; स्क्रिप्ट टाइप = "टेक्स्ट / जावास्क्रिप्ट" & gt; Function hideDiv () {document.getElementById ("कंटेनर")। Style.display = 'none'; } समारोह showDiv () {document.getElementById ('कंटेनर')। Style.display = "block"; } & Lt; / script & gt;   

HTML पृष्ठ

  & lt; div class = "masthead" & gt; & Lt; h3 वर्ग = "म्यूट" & gt; & Lt; sapn class = "लॉगिन-लोगो" & gt; & lt; img src = "img / QuadAnalytix_reg350x47.png" / & gt; & Lt; / span & gt; & lt; / h3 & gt; & Lt; / div & gt; & Lt; div id = "loginformcontainer" & gt; & LT; प्रपत्र & gt; & LT; लेबल & gt; उपयोगकर्ता नाम: & lt; input type = "text" name = "uname" & gt; & Lt; / लेबल & gt; & LT; लेबल & gt; पासवर्ड: & lt; इनपुट प्रकार = "पासवर्ड" नाम = "पीडब्ल्यूडी" & gt; & Lt; / लेबल & gt; & Lt; div class = "buttons1" & gt; & Lt; बटन प्रकार = "जमा करें" id = "सबमिट करें" मान = "लॉगिन" वर्ग = "बीटीएन" onclick = "showDiv ()" & gt; & Lt; / बटन & gt; सबमिट करें & Lt; बटन प्रकार = "रीसेट" id = "रीसेट" मान = "रीसेट करें" वर्ग = "बीटीएन" & gt; सभी को साफ़ करें & lt; / button & gt; & Lt; / div & gt; & Lt; div & gt; & Lt; div id = "कंटेनर" & gt; //index.html पृष्ठ & lt; / div & gt; & Lt; / body & gt; & Lt; / html & gt;   

यह लोड होने पर लॉगिन पृष्ठ दिखाता है, लेकिन जब मैं बटन पर क्लिक करता हूं तो यह केवल एक सेकंड के लिए कंटेनर डिवीज़ दिखाता है .. मुझे यहाँ क्या करना चाहिए?

आप इसे प्राप्त करने के लिए AJAX और कुछ जावास्क्रिप्ट का उपयोग कर सकते हैं।

उदाहरण के लिए, ऐसा कुछ: < P> HTML:

  & lt; div id = "index" & gt; & Lt; इनपुट प्रकार = "बटन" आईडी = "लॉगिनबटन" मान = "लॉगिन" & gt; & lt; / input & gt; & Lt; div id = "लॉगिन" शैली = "प्रदर्शन: कोई नहीं;" & gt; साइट पर आपका स्वागत है & Lt; / div & gt; & Lt; / div & gt;   

जावास्क्रिप्ट (jquery):

  $ ('# loginbutton')। क्लिक करें (फ़ंक्शन () {$ .post ('login.php', फ़ंक्शन (डेटा) {// यहाँ आप लॉगिन $ ('# लॉगिन')। शो ();}););    

No comments:

Post a Comment