努力讓它正常工作...使用 setInterval 制作 if/else 語句if，單擊該類，內容刷新，else內容在特定時間段后自動刷新。這就是我自動刷新 atm 的功能（效果很好）：var auto_refreshContentTwo = setInterval ( function() { $('.page_loading_r_content_two_overlay').fadeIn(); $.ajax({ url: '../../path/to/page.php', success: function(html) { var myContentTwoContent = $('#refreshContentTwo').html(html).find('#refreshContentTwo2'); $('#refreshContentTwo').html(myContentTwoContent); } }); }, 495000);我試圖添加“點擊”功能，但沒有做任何事情......：$('.contentTwoClicked').on('click', function() { var refreshClicked = true; if(refreshClicked) { alert('clicked'); $('.page_loading_r_content_two_overlay').fadeIn(); $.ajax({ url: '../../path/to/page.php', success: function(html) { var myContentTwoContent = $('#refreshContentTwo').html(html).find('#refreshContentTwo2'); $('#refreshContentTwo').html(myContentTwoContent); } }); } else { var auto_refreshContentTwo = setInterval ( function() { $('.page_loading_r_content_two_overlay').fadeIn(); $.ajax({ url: '../../path/to/page.php', success: function(html) { var myContentTwoContent = $('#refreshContentTwo').html(html).find('#refreshContentTwo2'); $('#refreshContentTwo').html(myContentTwoContent); } }); }, 495000 ); }});我哪里錯了？還是我在這里偏離了基地......？任何指導/幫助將不勝感激！
1 回答
jeck貓
TA貢獻1909條經驗 獲得超7個贊
您不需要條件語句，而是需要一個變量來存儲設置的間隔，以便可以通過調用函數清除并在手動刷新時重新啟動：
//variable to store the setInterval
let refreshInterval = '';
//function that calls setInterval
const autoRefresh = () => {
refreshInterval = setInterval(()=> {
refresh();
console.log("auto");
},3000)
}
//run setInterval function on page load;
autoRefresh();
//manual refresh function
const manualRefresh = () => {
//erases the setInterval variable
clearInterval(refreshInterval);
refresh();
//then recalls it to reset the countdown
autoRefresh();
console.log("manual");
}
//for visual purposes
let refreshCount = 0;
//node refresher function
const refresh = () => {
const container = document.getElementById("refresh");
refreshCount ++;
container.textContent= "This div will be refreshed"+ ` Refresh Count: ${refreshCount}`;
}
<button onclick="manualRefresh()">Click to Refresh </button>
<div id="refresh">This div will be refreshed</div>
查看實際效果：https://codepen.io/PavlosKaralis/pen/rNxzZjj ?editors=1111
編輯：應用于您的代碼我認為它將是：
let interval;
var autoRefresh = () => {
interval = setInterval (
function() {
$('.page_loading_r_content_two_overlay').fadeIn();
$.ajax({
url: '../../path/to/page.php',
success: function(html) {
var myContentTwoContent = $('#refreshContentTwo').html(html).find('#refreshContentTwo2');
$('#refreshContentTwo').html(myContentTwoContent);
}
});
}, 495000);
}
$('.contentTwoClicked').on('click', function() {
clearInterval(interval);
alert('clicked');
$('.page_loading_r_content_two_overlay').fadeIn();
$.ajax({
url: '../../path/to/page.php',
success: function(html) {
var myContentTwoContent = $('#refreshContentTwo').html(html).find('#refreshContentTwo2');
$('#refreshContentTwo').html(myContentTwoContent);
}
});
autoRefresh();
});
autoRefresh();
- 1 回答
- 0 關注
- 137 瀏覽
添加回答
舉報
0/150
提交
取消