I want to refresh the content of a div with jquery. I have this code but it always says the data and data_check doesn't match while they do when I alert them...
$(document).ready(function(){
pageLoad();
});
function reloadPage()
{
setTimeout(function(){
pageLoad();
},5000);
}
function pageLoad()
{
var data_check = $("div.portlet-body").html().replace(/\s+/g, '');
$.post("paginas/overzicht_sub.php",
function(data){
var data_output = data.replace(/\s+/g, '')
if(data_output==data_check)
{
return false;
}
else
{
$("div.portlet-body").html(data);
}
});
reloadPage();
}
Can someone help? I don't see the problem...
Ok I found the problem! There was a A-tag that always ended when there was no A-tag started. In the HTML (data_check) was that tag deleted and in the data not. Many thanks for the responses, I try to do it the next time with versions!
Remove the replace statement in pageLoad()
function pageLoad(){
var data_check = $("div.portlet-body").html();
$.post("aginas/overzicht_sub.php", function(data){
if(data_output==data){
return false;
}else{
$("div.portlet-body").html(data);
}
});
reloadPage();
}
Related
In below, When i click on button call the jquery click event,It will first shows the alerts upto this it works properly, In this i have call two functions(i.e. reload() and popup()) when i click on button it gives alerts and after that it execute popup() function and reload() function at a time.
My query is i want to execute first reload function(it reload only once) then execute popup function means when i click on button first reload the page only once and then show me my popup.
<script>
$(document).ready(function()
{
$('.button').click(function()
{
var href = $(this).val();
alert(href);
$.session.set("linkurl",href);
alert($.session.get('linkurl'));
//window.location.reload();
function reload()
{
if(document.URL.indexOf("#")==-1)
{
// Set the URL to whatever it was plus "#".
url = document.URL+"#";
location = "#";
//Reload the page
location.reload(true);
return true;
}
}
function popup()
{
document.getElementById('light').style.display='block';
document.getElementById('fade').style.display='block';
}
$.when( reload() ).done(function() {
popup();
});
});
});
</script>
<button class="button" value="<?php echo $value['3']; ?>" style="background-color:#ff8c21;">Buy Now</button>
try something like this:
function reload() {
if (document.URL.indexOf("#") == -1) {
// Set the URL to whatever it was plus "#".
url = document.URL + "#";
location = "#";
//Reload the page
location.reload(true);
return true;
}
function popup() {
document.getElementById('light').style.display = 'block';
document.getElementById('fade').style.display = 'block';
}
if($.session.set("reload") == true ) {
popup();
$.session.set("reload", false);
}
$('.button').click(function() {
$.session.set("reload", true);
reload();
});
The simple answer - it will not work. You cannot reload a page and execute any JavaScript after it. After unloading a page, JavaScript will stop executing.
You need to pass any sort of flag to your target page in order to tell it to show a popup. You can use GET parameters, for example.
There is a good Stackoverflow article on this topic:
Global Variable usage on page reload
$(document).ready(function() {
$('.button').click(function() {
var href = $(this).val();
alert(href);
$.session.set("linkurl", href);
alert($.session.get('linkurl'));
//window.location.reload();
reload(function () {
popup();
});
});
});
function reload(callback) {
if (document.URL.indexOf("#") == -1) {
// Set the URL to whatever it was plus "#".
url = document.URL + "#";
location = "#";
//Reload the page
location.reload(true);
return true;
}
}
function popup() {
document.getElementById('light').style.display = 'block';
document.getElementById('fade').style.display = 'block';
}
hi everyone I am new to Javascript and would like to know how would I refresh an if else statement in javascript every 5 seconds, i have looked and cannot get anything to work thanks in advance.
<script type="text/javascript">
if(total == randnum) {
document.write('Correct');
} else {
document.write('Incorrect');
}
</script>
Do you need to write out the document or can you display the text in some element like a div?
If so then you can try something similar to what 'chopper' suggested:
Assuming you have a div in your page with the id "myDiv"
<div id="myDiv"></div>
Then use this to write out your text:
var myDiv = document.getElementById("myDiv");
setInterval(function () {
if(total == randnum) {
myDiv.innerHTML = "Correct";
} else {
myDiv.innerHTML = "Incorrect";
}
}, 5000);
Wrap the code you want to repeat inside a function an use setInterval() (click for documentation with examples) for repeating it.
myFunction() {
//...
// Your code
//...
}
setInterval(myFunction, 5000);
And if you want it to start immediately and then repeat:
myFunction();
setInterval(myFunction, 5000);
setInterval will execute a given function periodically, for example like this:
setInterval( function() {
if(total == randnum) {
$('#result').append('Correct<br/>');
} else {
$('#result').append('Incorrect<br/>');
}
}, 5000);
Where
Of course you will have to define total and randnum.
See this jsFiddle.
Hi to every one I want to how I can reload a flash embed ,
I try to reload with the follow code:
function reload()
{
if (timerID)
{
clearTimeout(timerID);
}
tmp = findSWF("chart");
x = tmp.reload("data.php");
timerID = setTimeout("reload()", 3000);
}
function findSWF(movieName) {
if (navigator.appName.indexOf("Microsoft")!= -1) {
//return window["ie_" + movieName];
return document.getElementById('ie_'+movieName);
} else {
//return document[movieName];
return document.getElementById(movieName);
}
}
But the i get the follow js error:
tmp.reload is not a function
some know how to fix it, or if Im doing it rigth?
Thanks!!
you could just call a $.ajax or $.get function to replace the flash embed, put the flash embed in a container and user .innerHTML
for example:
if($.get("reload.php", { },
function (response){
document.getElementById('container').innerHTML = response;
})) {
} else {
alert ("Something's Wrong!");
}
You have an unclosed string!
x = tmp.reload("data.php"); ?>");
is the erroneous line.
Fix that and it should recognize your function.
and thanks to anyone who can help me!
I have a text with this code:
<a onclick="return showPic(this); mostrarespectacular()" href="Imatges/productosnuevos/urbano01.jpg">  Circuito Espectacular Barcelona</a>
and the scripts are:
<script type="text/javascript">
function showPic (whichpic) {
if (document.getElementById) {
document.getElementById('imgContenedor').src = whichpic.href;
if (whichpic.title) {
document.getElementById('imgDescripcion').childNodes[0].innerHTML = whichpic.innerHTML;
}
return false;
} else {
return true;
}
}
</script>
<script type="text/javascript">
function mostrarespectacular() {
div = document.getElementById('circuloespectacular');
div.style.display = 'inline';
}
function cerrarespectacular() {
div = document.getElementById('circuloespectacular');
div.style.display='none';
}
</script>
and my problem is that the first function works perfect but not the second one (which has to show a div). Any ideas of what i'm doing wrong? Thanks!!
You return from the onclick after the first function call. Remove that and you should be fine.
The "return" is branching out of the script after calling the showPic() function. Remove the return or place it before the "mostrarespectacular()" call or move it to the end, etc.
Context: On my product website I have a link for a Java webstart application (in several locations).
My goal: prevent users from double-clicking, i. e. only "fire" on first click, wait 3 secs before enabling the link again. On clicking, change the link image to something that signifies that the application is launching.
My solution works, except the image doesn't update reliably after clicking. The commented out debug output gives me the right content and the mouseover callbacks work correctly, too.
See it running here: http://www.auctober.de/beta/ (click the Button "jetzt starten").
BTW: if anybody has a better way of calling a function with a delay than that dummy-animate, let me know.
JavaScript:
<script type="text/javascript">
<!--
allowClick = true;
linkElements = "a[href='http://www.auctober.de/beta/?startjnlp=true&rand=1249026819']";
$(document).ready(function() {
$('#jnlpLink').mouseover(function() {
if ( allowClick ) {
setImage('images/jetzt_starten2.gif');
}
});
$('#jnlpLink').mouseout(function() {
if ( allowClick ) {
setImage('images/jetzt_starten.gif');
}
});
$(linkElements).click(function(evt) {
if ( ! allowClick ) {
evt.preventDefault();
}
else {
setAllowClick(false);
var altContent = $('#jnlpLink').attr('altContent');
var oldContent = $('#launchImg').attr('src');
setImage(altContent);
$(this).animate({opacity: 1.0}, 3000, "", function() {
setAllowClick(true);
setImage(oldContent);
});
}
});
});
function setAllowClick(flag) {
allowClick = flag;
}
function setImage(imgSrc) {
//$('#debug').html("img:"+imgSrc);
$('#launchImg').attr('src', imgSrc);
}
//-->
</script>
A delay can be achieved with the setTimeout function
setTimeout(function() { alert('something')}, 3000);//3 secs
And for your src problem, try:
$('#launchImg')[0].src = imgSrc;
Check out the BlockUI plug-in. Sounds like it could be what you're looking for.
You'll find a nice demo here.
...or just use:
$(this).animate({opacity: '1'}, 1000);
wherever you want in your code, where $(this) is something that is already at opacity=1...which means everything seemingly pauses for one second. I use this all the time.
Add this variable at the top of your script:
var timer;
Implement this function:
function setFlagAndImage(flag) {
setAllowClick(flag);
setImage();
}
And then replace the dummy animation with:
timer = window.setTimeout(function() { setFlagAndImage(true); }, 3000);
If something else then happens and you want to stop the timer, you can just call:
window.clearTimeout(timer);