PDA

View Full Version : سوال: چطوری میشه یک پیغام رو بعد 3 ثانیه به کاربر نشون داد؟؟؟



hamidhassas
یک شنبه 11 آبان 1393, 22:33 عصر
من میخوام کاری کنم که وقتی کاربر روی تگ a کلیک کرد اول ی عکس نمایش داده بشه بعد از 3 ثانیه عکس بره و ی پیغام ثبت شد نمایش داده بشه

Mohammadsgh
یک شنبه 11 آبان 1393, 22:37 عصر
با ایجکس میتونید اینکار رو بکنید(همچین کاریو کردم ولی زمان مشخصی نداشت)

n0o0b_sina
یک شنبه 11 آبان 1393, 22:57 عصر
سلام
به این لینک یه سر بزنید مشکلتون حل میشه :)
http://www.w3schools.com/jsref/met_win_settimeout.asp

hamidhassas
یک شنبه 11 آبان 1393, 23:08 عصر
سلام
به این لینک یه سر بزنید مشکلتون حل میشه :)
http://www.w3schools.com/jsref/met_win_settimeout.asp

خوب من الان چطوری میتونم با کلیک روی باتوم اول ی عکس نشون بدم بعد عکس حذف بشه بعد از چند ثانه یک پیغام نمایش داده بشه همه اینکارا در یک div اتفاق بیوفته



<button onclick="myFunction()">Try it</button>
<div id="view"></div>
<script>
function myFunction()
{
var myVar = document.getElementById("view");
setTimeout(function(){document.write("<img src=images/spinner.gif>")}, 3000);
setTimeout(function(){clearTimeout(myVar)}, 1000);
setTimeout(function(){document.write("<p>تایید شد</p>")}, 3000);
}
</script>

marys_farahani
دوشنبه 12 آبان 1393, 16:54 عصر
خیلی ساده و ابتدایی نوشتم


<script language="javascript" >
function fun_loading()
{
$(".center").css("display", "block");
$(".txt_com").css("display", "none");
setTimeout(function(){
$(".center").css("display", "none");
$(".txt_com").css("display", "block");
}, 3000);
}
</script>
</head>
<body>
<a href="javascript:void(0);" onclick="fun_loading();" >click</a>
<p class="txt_com">عملیات شما با موفقیت ثبت شد</p>
<div class="center">
<img src="ajax-loader.gif"/>
</div>
</body>

hamedarian2009
دوشنبه 12 آبان 1393, 18:33 عصر
اگه با جی کوئری آشنایی دارین بهتره از جی کوئری ای جکس استفاده کنید. در مورد preloader سرچ کنید

arta.nasiri
دوشنبه 12 آبان 1393, 19:26 عصر
بهتره از متد ajax تو jQuery استفاده کنید و موقع کلیک، تصویر مورد نظرتون رو append کنید و وقتی نتیجه موفق بود done رو اجرا کنید و پیام مورد نظرتون رو به کاربر نشون بدید.

hamidhassas
دوشنبه 12 آبان 1393, 22:55 عصر
خیلی ساده و ابتدایی نوشتم


<script language="javascript" >
function fun_loading()
{
$(".center").css("display", "block");
$(".txt_com").css("display", "none");
setTimeout(function(){
$(".center").css("display", "none");
$(".txt_com").css("display", "block");
}, 3000);
}
</script>
</head>
<body>
<a href="javascript:void(0);" onclick="fun_loading();" >click</a>
<p class="txt_com">عملیات شما با موفقیت ثبت شد</p>
<div class="center">
<img src="ajax-loader.gif"/>
</div>
</body>
کار نمیکنه

من میخوام ی لینک باشه که وقتی روش کلیک شد اول ی عکس که درحال لود هست نشون بده بعد 3 ثانه عکس بره و یک پیغام با p چاپ کنم

arta.nasiri
سه شنبه 13 آبان 1393, 11:28 صبح
سلام

فقط قبلش jQuery رو include کنید.
href رو هم به آدرس مورد نظر خودتون تغییر بدین


<a class="doProcess" href="/echo/html/">Send Data</a><br>
<img id="loading" src="http://sierrafire.cr.usgs.gov/images/loading.gif" width="100px" style="display:none;"/>
<span id="message"></span>
<script>
$(document).ready(function() {
$('.doProcess').on('click', function() {
$('#loading').show();
$.ajax({url: $(this).attr('href'), type: 'get'})
.done(function(data) {
$('#loading').hide();
$('#message').html('your messag here....');
});

return false;
});
});
</script>

hamidhassas
سه شنبه 13 آبان 1393, 12:22 عصر
سلام

فقط قبلش jQuery رو include کنید.
href رو هم به آدرس مورد نظر خودتون تغییر بدین


<a class="doProcess" href="/echo/html/">Send Data</a><br>
<img id="loading" src="http://sierrafire.cr.usgs.gov/images/loading.gif" width="100px" style="display:none;"/>
<span id="message"></span>
<script>
$(document).ready(function() {
$('.doProcess').on('click', function() {
$('#loading').show();
$.ajax({url: $(this).attr('href'), type: 'get'})
.done(function(data) {
$('#loading').hide();
$('#message').html('your messag here....');
});

return false;
});
});
</script>


جواب نمیده وقتی با html فایل زخیره میشه اول عکس نشون میده و اگه با php زخیره کنم 'your messag here....مینویسه

بعدش تواین کدی که نوشتین چطوری تایم رو بهش بدم مثلا 3 ثانیه


من فقط میخوام ی لینک یا یک button باشه با کلیک روش اول یک عکس نشون بده بعد 3 ثانیه عکس برتش و یک پیغام جاش نمایش داده بشه همین

hamedarian2009
سه شنبه 13 آبان 1393, 13:48 عصر
یه مثال خیلی ساده برات زدم امیدوارم استفاده کنی
صفحه html :


<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<button>Click Me</button>
<div id="result">
<img src="http://jimpunk.net/Loading/wp-content/uploads/loading70.gif" id="preloader" />
</div>
<!-- Loding js files -->
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
(function(){
var preloader = $('#preloader');
preloader.hide();
$(document).ajaxStart(function(){
preloader.show();
});
$(document).ajaxStop(function(){
preloader.hide();
});
$('button').on('click', function(){
$.ajax({
type: 'GET',
url: 'coding.php',
success: function(result){
$('#result').html(result);
} ,
error: function(){
alert('error');
}
});
});
})();
</script>
</body>
</html>

این صفحه اطلاعات رو به صورت ای جکس از صفحه php به نام coding.php با تاخیر 3 ثانیه ای میگیره و برات پیغام رو نشون میده

sleep(3);
echo '<b>This message is test.</b>';

فقط باید کتابخانه جی کوئری رو به صفحت اضافه کنی و عکس رو هم هرچی خواستی آدرسشوبه src تگ img بدی