|
JavaScript - Page Doesn't Auto Refresh In Safari
Most of the Javascript I see has some sort of time limit on page reload and is not really what I am trying to accomplish:
Code: <meta http-equiv="Refresh" content="10; URL=http://coffeeandtealtd.com/buynow.html" /> I am trying to make our buy page reload after clicking the Paypal "continue shopping" button in Paypal Website Standards. The pop up Paypal shopping cart window closes after clicking the button but our buy page doesn't reload. It doesn't reload in Safari although it seems to be fine in FF and IE. I am new to javascript coding and am not quite sure how to make the page reload in this specific instance only. Any sug's?? Similar Tutorials<HEAD><TITLE>main</TITLE> <meta http-equiv="refresh" content="5;url=http://localhost/php_basic/short_pro/php/main.php"> <!--<script language="JavaScript"> var i=0; function validat() { setTimeout("moretext()",5000); alert("santosh"); } function moretext() { if(i==0) { alert(window.location); window.location.reload(); i++; } else { } } </script>--> </head> <BODY onload="validat();"> i hav written dis code to auto refresh page only once but it is refreshing after every 5 seconds. Earlier i hav wriiten meta tag but it is refreshing page after every 5 seconds & after that i hav wriiten script to auto reffresh page only once but they both r doin the same work,so can u plz help me in solvin my problem I've a web page when a user logs in, it will have a link that shows the "username" and a link for "logout". After the user logs out, the "username" and the "logout" links will change to "login" and "register" links, respectively. The page uses javascript to check a user cookie, if the user cookie exists, it will show the "username" link and the link for "logout". If no user cookie exists, "login" and "register" links will replace the "username" and "logout" links. Here's the problem: When a user who has log in, clicks the "logout" link, a perl script will delete the user cookie, and redirects back to the same page. The page does not show "login" and "register" links AUTOMATICALLY. Both links will appear ONLY after the user MANUALLY Refreshes the page. It appears that I need a system to refresh the page automacally ONLY one time. How can this be done? I'm attaching my php test file but this is a JS problem. When I scroll down in the web page and the meta refresh hits, in Windows Safari and IE6/7/8 browsers, the web page re-positions back to the top. In Opera and FF the page refreshes but it stays where it is. Can someone look at my test script and see why it is not working in IE and Win Safari? My goal is to have the web page not re-position to the top on the auto refresh. Thanks... FF, Safari, Opera all execute this javascript code to refresh the page properly, but in IE version 8.0.6001.18904 the page doesn't seem to refresh on click of orange_refresh button. I have checked out a different version of IE8, don't recall exact version, but it did seem to work fine in that one, whatever version it was probably the latest now that I think of it. Check out code below any sug.'s could be helpful, though its probably a bug.. Code: <a href="javascript:document.location.reload();" onmouseover="window.status='Refresh'; return true" onmouseout="window.status='Page Refreshed'"><img src="image/orange_refresh.png" width="30" height="30" border="0" /></a> I have a php file lets say file1.php, that printing a variable, its dynamic numbers output that already always increasing, like private message numbers that coming or others : PHP Code: <?php echo $variable ?> i want to put that variable output, in another files page title, lets say file2.php or file3.html, in the front of the another files page titles, and auto refresh every x seconds, maybe like this : Quote: (1) - another text in the page title after x seconds, get a private message Quote: (2) - another text in the page title after another x seconds, get another private message Quote: (3) - another text in the page title or its ok if just like this, only the variable, without the another text in the page title Quote: (1) please share your knowledge to make it, maybe using javascript, jquery or others Hello, I don't know if this can be done in Javascript, or requires any other language but i was wondering if this would be possible. I would like to embed this Javascript code in to a PHP file and then for it to run automatically upon the PHP file loading: Code: <td class="smallDesc"> <a name="fb_share" type="button_count" href="http://www.facebook.com/sharer.php">Share</a><script src="http://static.ak.fbcdn.net/connect.php/js/FB.Share" type="text/javascript"></script> </td> The Javascirpt is the Facebook Share button that basically allows users that have Facebook to share the page there currently on in their Facebook status by pressing the button, but if there not logged in it shows the login page, not a problem just continue the script. The current button i which is what i want to load automatically in the PHP file is located here, to test the functionalilty just click "Share" button in blue.. http://watch-movies-online.anyfilman...-Movie-17.html To summarise, i would like the above Javascript code to execute automatically upon pageload of this PHP file.. http://www.watch-movies-online.anyfi...p://google.com. If that could be done, and if this also is possible.. i would like for the "Share" button on the external page that is loaded from the Javascript code above to be clicked automatically so in effect when ever someone visits the PHP page after clicking "Click Here to Watch/Stream 2012 Online For Free" on this page it will automatically load the Facebook Share box, and automatically click the "Share" Button and then close the page if possible, but not required. Please feel free to ask any questions, i'll be happy to answer. Thanks in advance. Best Regards, Jonathan. I have some sample ajax code i have been toying around with. I have it updating & working properly, but you have to click a button first. How can I set it so that it automatically reads the contents of the text file on page load, and updates every 1000ms? I was trying Code: onload=setinterval(JavaScript:xmlhttpPost("status.php"),1000)
but had not luck Any suggestions? Code below. PHP Code: <? $myFile = "testFile.txt"; $fh = fopen($myFile, 'r'); $theData = fread($fh, 3); fclose($fh); echo $theData; ?> Code: <html>
<head>
<title>Simple Ajax Example</title>
<script language="Javascript">
function xmlhttpPost(strURL) {
var xmlHttpReq = false;
var self = this;
// Mozilla/Safari
if (window.XMLHttpRequest) {
self.xmlHttpReq = new XMLHttpRequest();
}
// IE
else if (window.ActiveXObject) {
self.xmlHttpReq = new ActiveXObject("Microsoft.XMLHTTP");
}
self.xmlHttpReq.open('POST', strURL, true);
self.xmlHttpReq.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
self.xmlHttpReq.onreadystatechange = function() {
if (self.xmlHttpReq.readyState == 4) {
updatepage(self.xmlHttpReq.responseText);
}
}
self.xmlHttpReq.send(getquerystring());
}
function getquerystring() {
var form = document.forms['f1'];
var word = form.word.value;
qstr = 'w=' + escape(word); // NOTE: no '?' before querystring
return qstr;
}
function updatepage(str){
document.getElementById("result").innerHTML = str;
}
</script>
</head>
<body>
<form name="f1">
<p>word: <input name="word" type="text">
<input value="Go" type="button" onclick='JavaScript:xmlhttpPost("status.php")'></p>
<div id="result"></div>
</form>
</body>
</html>
Been trying to get this auto refreshed instead of clicking to refresh <center><iframe src="http://orange.citrus3.com:8338/played.html" width=800 height=400 frameborder=0 scrolling=no id="myiframe"></iframe></center><br> <center><b><BIG><body link="#FF0000"><a href="javascript:myiframe.document.location.reload()">Refresh Current Song</a></BIG></b></center> I'm replacing the shoutbox on my site. Everything works and looks great. Now I'd like to make it auto refresh. Here's the update function. PHP Code: function updateShoutbox(){ //send the post to shoutbox.php $.ajax({ type: "POST", url: "shoutbox.php", data: "action=update", complete: function(data){ loading.remove(); messageList.html(data.responseText); } }); } And here is what I've tried to add to make it auti refresh, but it doesn't work. PHP Code: setTimeout('updateShoutbox()', 4000); I know very little about js, so any help is appreciated. A noob needs some help. I'm using a combination of Yahoo Pipes and rssdisplayer.js to display some snippets from several RSS feeds on a new site I'm building. The trouble I'm having is that (i) the feeds don't update when I refresh the page, I think because a cached version of the page is being loaded, and (ii) I'd like to have the div containing the feeds auto-refresh at a given time interval. I've got a Twitter javascript working that does both these things, but can't work out how to get the rssdisplayer.js working this way. The rssdisplayer code is: Code: google.load("feeds", "1") //Load Google Ajax Feed API (version 1)
function rssdisplayer(divid, url, feedlimit, showoptions){
this.showoptions=showoptions || "" //get string of options to show ("date" and/or "description")
var feedpointer=new google.feeds.Feed(url) //create new instance of Google Ajax Feed API
feedpointer.setNumEntries(feedlimit) //set number of items to display
document.write('<div id="'+divid+'">Loading feed...</div>')
this.feedcontainer=document.getElementById(divid)
var displayer=this
feedpointer.load(function(r){displayer.formatoutput(r)}) //call Feed.load() to retrieve and output RSS feed
}
rssdisplayer.prototype.formatdate=function(datestr){
var itemdate=new Date(datestr)
return "<span style='color:gray; font-size: 90%'>"+itemdate.toLocaleString()+"</span>"
}
rssdisplayer.prototype.formatoutput=function(result){
if (!result.error){ //if RSS feed successfully fetched
var thefeeds=result.feed.entries //get all feed entries as a JSON array
var rssoutput="<ul>"
for (var i=0; i<thefeeds.length; i++){ //loop through entries
var itemtitle="<a href=\"" + thefeeds[i].link + "\">" + thefeeds[i].title + "</a>"
var itemdate=/date/i.test(this.showoptions)? this.formatdate(thefeeds[i].publishedDate) : ""
var itemdescription=/description/i.test(this.showoptions)? "<br />"+thefeeds[i].content : ""
rssoutput+="<li>" + itemtitle + " " + itemdate + itemdescription + "</li>"
}
rssoutput+="</ul>"
this.feedcontainer.innerHTML=rssoutput
}
else //else, output error
alert("Error fetching feeds: "+result.error.message)
}
//USAGE SYNTAX: new rssdisplayer("divid", "rssurl", numberofitems, "displayoptions")
//new rssdisplayer("adiv", "http://www.cssdrive.com/index.php/news/rss_2.0/", 5, "date, description")
I'm using meta refresh to refresh my web page. I have a small compose email window that appears via ajax when the user clicks on a name. Is there a way I can disable the screen refresh in my ajax code while they are composing their message? Hey helpful people. I'm looking for a better solution to refreshing a page of mine, which currently single page (no frames) using meta refresh. To convert it something where it (using frames) would either: a. keep trying to refresh untill a var is recieved from the content, or b. present the browser with a button to refresh and a message that loading failed. But honestly i am a noob at javascript, to an extend i dont have much idea where to start on such a project. but learned this is not possible with regular html that is widely supported anyways. i suspect the:.. window.xx.location='url' ..is useful in this regard, but other than that i am blank on where to start. Any help is appresiated. Thanks in advance Jilli I have a web page that loads and Auto scrolls to the end. I need to either auto scroll up, or when it reaches the bottom auto refreshes back to the top. I have had to define a length longer than the document or I get scroll bars and the Iframe won't scroll. Here is the code. [Code] <html> <head> <script type="text/javascript" language="JavaScript" ></script> <title>How to Scroll the Page With JavaScript</title> <meta name="description" content="How to scroll the page automatically using JavaScript." /> <meta name="keywords" content="javascript, page, scroll" /> <script type="text/javascript"> function pageScroll() { window.scrollBy(0,25); scrolldelay = setTimeout('pageScroll()',5000); // scrolls every 1000 milliseconds } </script> </head> <iframe src="file:///D:/PrivateDocs/WorkflowPage/Stinkyxml.htm" name="frame1" scrolling="auto" frameborder="no" style="float:left" height="4500" width="100%"> <body onLoad="pageScroll()"></body> </iframe> <body> <body onLoad="pageScroll()"></body> </body> </html> [icode] Guy help me for the solution... how to refresh the markers only every x... below are my full scripts.... Code: <?php
define('INCLUDE_CHECK',1);
include "dbconnect.php";
?>
<!DOCTYPE html>
<html lang="en">
<head>
<script type="text/javascript" src="host_entry/js/jquery-1.7.1.min.js"></script>
<!-- Google Map JS -->
<script src="http://maps.google.com/maps/api/js?key=AIzaSyDY0kkJiTPVd2U7aTOAwhc9ySH6oHxOIYM&sensor=false" type="text/javascript"></script>
</head>
<div id="map_canvas" style="top:55px;left:13px;"> <!-- Map will display -->
<div id="map"> <!-- Fullscreen Loading & Fullscreen Buttons area -->
</div>
<!-- Fullscreen Loading & Fullscreen Buttons area Ends -->
</div><!-- Map Ends display -->
<script type="text/javascript">
/**function show_data()
{
$('#map').load('index.php');
}
setInterval('show_data()', 60000);
**/
var locations = [
<?php
$query="SELECT * from host_entry";
$result=mysql_query($query)or die(mysql_error());
{
if ($num=mysql_numrows($result))
{
$i=0;
while ($i < $num)
{
$id=mysql_result($result,$i,"id");
//$host_type=mysql_result($result,$i,"host_type");
$host_name=mysql_result($result,$i,"host_name");
$host_server=mysql_result($result,$i,"host_server");
$host_status=mysql_result($result,$i,"host_status");
$host_lapt=mysql_result($result,$i,"host_lapt");
$host_long=mysql_result($result,$i,"host_long");
$host_circuit=mysql_result($result,$i,"host_circuit");
$host_hotline=mysql_result($result,$i,"host_hotline");
if($host_status==0)
echo "['<div class=container style=width:400px;><div class=page-header><h4>$host_name</h4></div>', $host_lapt, $host_long],";
$i++;
}
}else {
echo "<h3 align='center'><font color='#ff0000'>No Content Found</font></h3>";
}
}
?>
];
// Setup the different icons and shadows
var iconURLPrefix = 'host_entry/img/';
var icons = [
iconURLPrefix + 'p_red_alert.png'
]
var icons_length = icons.length;
var map = new google.maps.Map(document.getElementById('map'), {
zoom: -5,
center: new google.maps.LatLng(3.1215681, 101.71180140000001),
mapTypeId: google.maps.MapTypeId.ROADMAP,
mapTypeControl: false,
streetViewControl: false,
disableDefaultUI: true,
panControl: false,
zoomControlOptions: {
position: google.maps.ControlPosition.LEFT_BOTTOM
}
});
var marker;
var markers = new Array();
var iconCounter = 0;
var infowindow = new google.maps.InfoWindow({
maxWidth: 400,
maxHeight: 350,
});
// Add the markers and infowindows to the map
for (var i = 0; i < locations.length; i++) {
marker = new google.maps.Marker({
position: new google.maps.LatLng(locations[i][1], locations[i][2], locations[i][3], locations[i][4], locations[i][5]),
map: map,
animation: google.maps.Animation.BOUNCE,
icon : icons[iconCounter],
});
markers.push(marker);
google.maps.event.addListener(marker, 'click', (function(marker, i) {
return function() {
infowindow.setContent(
locations[i][0]
);
infowindow.open(map, marker);
setTimeout(function(){infowindow.close();}, '5000');
}
})(marker, i));
iconCounter++;
// We only have a limited number of possible icon colors, so we may have to restart the counter
if(iconCounter >= icons_length){
iconCounter = 0;
}
}
function AutoCenter() {
// Create a new viewpoint bound
var bounds = new google.maps.LatLngBounds();
// Go through each...
$.each(markers, function (index, marker) {
bounds.extend(marker.position);
});
// Fit these bounds to the map
map.fitBounds(bounds);
}
AutoCenter();
</script>
</body>
</html>
do i need to apply setInterval on the marker? how to apply it on the marker so it refresh every X second... please help for the solution.... Hello, I am fairly new to Javascript, but so far I have managed to have the page auto scroll when you browse. I was also able to get a button that toggles the start/stop of the scrolling. What I need to happen is when the scrolling reaches the bottom of the screen, I need it to refresh. Is this possible? Thank you in advance!!! If you go to a Youtube video by Justin Bieber or Rebecca Black, comments are constantly being posted and it seems like the autorefresh for the comments kicks in every half second. I don't plan on having millions of users viewing my page, but still, wouldn't having every user make a [mysql] request to the server every half second really take a toll on the server (especially since I don't plan to ever have the resources that Youtube has)? Facebook also seems to have instantaneous auto-refreshes, be it in comment boxes or their chat interface. So what would be the best method to implement a near-instantaneous autorefresh system with minimal resource usage? I currently have this on my companies website and it's having a bit of trouble sometimes where it will only work after a refresh. Is it possible to do a refresh of this div and script as soon as the site loads, instead of using the auto refresh. I tried using auto refresh and it works but whatever time interval I put for the auto refresh is the time that the script pops up, so it kind of just makes it worst. Code: <script type="text/javascript">
$(document).ready(function() {
$("#twitter").getTwitter({
userName: "lubellrosen",
numTweets: 4,
loaderText: "Loading Events...",
slideIn: true,
slideDuration: 750,
showHeading: false,
headingText: "Latest Tweets",
showProfileLink: false,
showTimestamp: false
});
});
</script>
http://isensors.com.sg/isensors-GJ/ That's the page I'm working on now, the script I'm using from he http://www.frontpagewebmaster.com/m-89000/tm.htm posted by collide007. It allows me to resize my iframe when a new page loads in it, it's working fine on Chrome and Firefox. For safari, the iframe expands but does not contract when a smaller page is loaded in. The code doesn't even work in IE. <script type="text/javascript"> //Input the IDs of the IFRAMES you wish to dynamically resize to match its content height: //Separate each ID with a comma. Examples: ["myframe1", "myframe2"] or ["myframe"] or [] for none: var iframeids=["contentframe", "newsframe"] //Should script hide iframe from browsers that don't support this script (non IE5+/NS6+ browsers. Recommended): var iframehide="no" var getFFVersion=navigator.userAgent.substring(navigator.userAgent.indexOf("Firefox")).split("/")[1] var FFextraHeight=parseFloat(getFFVersion)>=0.1? 3 : 0 //extra height in px to add to iframe in FireFox 1.0+ browsers function resizeCaller() { var dyniframe=new Array() for (i=0; i<=iframeids.length; i++){ var iframeid = iframeids[i]; if (document.getElementById) resizeIframe(iframeid) //reveal iframe for lower end browsers? (see var above): if ((document.all || document.getElementById) && iframehide=="no"){ var tempobj=document.all? document.all[iframeid] : document.getElementById(iframeid) tempobj.style.display="block" } } } function resizeIframe(frameid){ var currentfr=document.getElementById(frameid) if (currentfr && !window.opera){ currentfr.style.display="block" if (currentfr.contentDocument && currentfr.contentDocument.body.offsetHeight) //ns6 syntax currentfr.height = currentfr.contentDocument.body.offsetHeight+FFextraHeight+50; else if (currentfr.Document && currentfr.Document.body.scrollHeight) //ie5+ syntax currentfr.height = currentfr.Document.body.scrollHeight+50; if (currentfr.addEventListener) currentfr.addEventListener("load", readjustIframe, false) else if (currentfr.attachEvent){ currentfr.detachEvent("onload", readjustIframe) // Bug fix line currentfr.attachEvent("onload", readjustIframe) } } } function readjustIframe(loadevt) { var crossevt=(window.event)? event : loadevt var iframeroot=(crossevt.currentTarget)? crossevt.currentTarget : crossevt.srcElement if (iframeroot) resizeIframe(iframeroot.id); } function loadintoIframe(iframeid, url){ if (document.getElementById) document.getElementById(iframeid).src=url } if (window.addEventListener) window.addEventListener("load", resizeCaller, false) else if (window.attachEvent) window.attachEvent("onload", resizeCaller) else window.onload=resizeCaller </script> Could someone kindly help me find the problem? Thanks. I manage a private website that has a normal desktop version and also an iPhone version. Both versions use jQuery. I'm wondering if I could get some help with the iPhone version. Right now, I have one of the navigation items set up so that when it's tapped on, a submenu with more navigation items appear. This is much like the "more" menu at the iPhone version of http://www.google.com/. The problem I'm having is that once that submenu is shown, the only way to make it disappear again is to tap on one of its items. I'd like to be able to tap anywhere outside of the submenu to make it disappear. This is how the iPhone version of http://www.google.com/ behaves, so I know it's possible. The only way I can think of accomplishing this is to add a click event to the body that calls a function that removes the submenu. However, I can't get it to work. At the bottom of this post you will find code that illustrates this problem. I would really appreciate any help. Thanks! Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<title>Safari Mobile Test</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="viewport" content="width=320; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;">
<style type="text/css">
body {
border: 1px solid red;
}
</style>
</head>
<body>
<h1>Safari Mobile Test</h1>
<p><a href="#">This link doesn't go anywhere. If you click it, you will get an alert indicating that the link was clicked and a separate alert indicating that the body was clicked.</a></p>
<p>In a normal web browser, clicking anywhere within the body of this page (which is surrounded by a red border) will trigger an alert indicating that the body was clicked. However, the only way to see the alert using Safari Mobile is to click on the above link.</p>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('body').click(function() {
alert('The body was clicked!');
});
$('a').click(function() {
alert('The link was clicked!');
});
});
</script>
</body>
</html>
|
|||||||