2009-03-13 12 views
6

मैं फ्रेम में किसी पृष्ठ के स्थान को अपडेट करने के लिए AJAX का उपयोग कर रहा हूं। लेकिन हैश के स्थान को सेट करते समय (क्रोम पर और आईई (5.5) के कुछ संस्करण विशेष रूप से, लेकिन कभी-कभी आईई 7 पर) पृष्ठ को फिर से लोड किया जा रहा है।फ़्रेम में स्थान.hash सेट करना

निम्नलिखित एचटीएमएल समस्या का प्रदर्शन करता है।

मुख्य फ्रेम .... frame.html

<html><head> 
<frameset rows="*"> 
<frame src=sethash.html frameborder=0 scrolling=auto name=somebody> 
</frameset> 
</head></html> 

sethash.html पेज है।

<html><head> 
<script language=JavaScript> 
var Count = 0; 
function sethash() 
{ 
    top.document.location.hash = "hash" + Count; 
    Count++; 
} 
</script> 
</head> 
<body onload="alert('loaded')"> 
<h1>Hello</h1> 
<input type='button' onClick='sethash()' value='Set Hash'> 
</body> 
</html>` 

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

के कुछ संस्करणों पर

माइक्रोसॉफ्ट रिपोर्ट संभवतः एक ही समस्या के साथ Internet Explorer 5.5 link text

मैं माइक्रोसॉफ्ट सुझाव दिया समाधान, घटना को पकड़ने और यह आग नहीं है जो उपयोग नहीं कर सकते, लेकिन सिर्फ स्क्रॉल देखने के लिए, जैसा कि ऑनलोड ईवेंट के हिस्से के रूप में top.location.hash सेट का उपयोग कर रहा हूं।

उत्तर

6

वेबकिट (और विस्तार से, क्रोम) location.hash के साथ अजीब व्यवहार करता है। इसके बारे में कुछ खुली बग हैं, सबसे प्रासंगिक शायद यह है: https://bugs.webkit.org/show_bug.cgi?id=24578 जो दस्तावेज़.hash बदलते समय पेज रीफ्रेश करने की आपकी समस्या को दस्तावेज करता है। ऐसा लगता है कि अभी आपकी सबसे अच्छी पसंद है कि आप अपनी उंगलियों को पार करें और उम्मीद करें कि यह तुरंत ठीक हो जाए।

मैं IE7 में बग पुन: पेश नहीं कर सकते हैं, हालांकि, और आप उम्र में पहले व्यक्ति का समर्थन करता है कि IE5.5 तो मैं सच में तुम वहाँ मदद नहीं कर सकता मैंने देखा है कर रहे हैं;)

0

आप शामिल हैं हैश के छिपे हुए लिंक बनाने और उन पर भी क्लिक करने की कोशिश की?

0

location.href = '#yourhash'; करने के बारे में क्या हो सकता है कि यह बग को छोड़ देता है।

2

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

jQuery के साथ

, मैंने किया था:

 
if($.browser.webkit){ 
    $(window).unload(function() { 
     top.window.location.hash = hash_value; 
    }); 
}else{ 
    top.window.location.hash = hash_value; 
} 

तकनीकी तौर पर आप इसे पहले सही हैश मान को देखने के लिए अच्छा हो सकता है वेबकिट जांच की जरूरत नहीं है, लेकिन मैं लोग हैं, जो फ़ायरफ़ॉक्स का उपयोग के लिए लगा कि वे फ्रेमसेट रीफ्रेश करें।

-Jacob

2
क्रोम और सफारी के लिए

, आप हैश से window.location.hash

नीचे

function loadHash(varHash) 
{ 
    if(varHash != undefined) { 
    var strBrowser = navigator.userAgent.toLowerCase(); 

    if (strBrowser.indexOf('chrome') > 0 || strBrowser.indexOf('safari') > 0) { 
     this.location.href = "#" + varHash; 
    } 
    else { 
     this.window.location.hash = "#" + varHash; 
    } 
    } 
} 
1

कोड को देखने के बजाय काम कर पाने के window.location.href उपयोग करने की आवश्यकता मेरे पास एक वर्कअराउंड है और इसमें एम्बेडेड आईफ्रेम के साथ एक पूर्ण-पृष्ठ तालिका शामिल है। मैंने अपने फ्रेमसेट को एक टेबल के साथ बदल दिया जो 100% ऊंचाई और 100% चौड़ाई लेता है और इसमें दो पंक्तियां होती हैं। फिर, प्रत्येक तालिका कक्ष में मैंने एक आईफ्रेम लगाया जो प्रत्येक सेल के लिए 100% ऊंचाई और चौड़ाई लेता है। यह, अनिवार्य रूप से, एक फ्रेमसेट के बिना एक फ्रेमसेट नकल नकल। सबसे अच्छा, हैश परिवर्तन पर कोई पुनः लोड नहीं!

यहाँ मेरे पुराने कोड है:

<html> 
<head> 
<title>Title</title> 
</head> 
<frameset rows="48,*" frameborder="yes" border="1"> 
    <frame name="header" noresize="noresize" scrolling="no" src="http://header" target="_top"> 
    <frame name="main" src="http://body" target="_top"> 
    <noframes> 
    <body> 
    <p>This page uses frames, but your browser doesn&#39;t support them.</p> 
    </body> 
    </noframes> 
</frameset> 
</html> 

... और यहां अपने नए कोड है:

<html> 
<head> 
<title>Title</title> 
<style type="text/css"> 
body { margin: 0px; padding: 0px; border: none; height: 100%; } 
table { height:100%; width:100% } 
td { padding: 0px; margin: 0px; border: none; } 
td.header { height: 48px; background-color: black; } 
td.body { background-color: silver; } 
iframe.header { border: none; width: 100%; height: 100%; } 
iframe.body { border: none; width: 100%; height: 100%; } 
</style> 
</head> 
<body> 
<table cellpadding="0" cellspacing="0"> 
    <tr><td class="header"><iframe class="header" src="http://header" target="_top" scrolling="no"></iframe></td></tr> 
    <tr><td class="body"><iframe class="body" src="http://body" scrolling="no"></iframe></td></tr> 
</table> 
</body> 
</html> 

आशा इस मदद करता है।

3

आप Chrome में पृष्ठ को फिर से लोड किए बिना हैश को बदलने के लिए HTML5 history.pushState() का भी उपयोग कर सकते हैं। कुछ इस तरह:

// frameset hash change function 
function changeHash(win, hash) { 
    if(history.pushState) { 
     win.history.replaceState(null, win.document.title, '#'+hash); 
    } else { 
     win.location.hash = hash; 
    } 
} 

पहला तर्क में आप फ्रेम शीर्ष खिड़की पारित करने के लिए की जरूरत है।

+0

यह काम करता है। छोटा नोट: [क्रोम फेविकॉन में एक झिलमिलाहट दिखाएं और बटन को बंद/ताज़ा करें] (http://code.google.com/p/chromium/issues/detail?id=50298), जो बदसूरत दिखता है। – Blaise