PDA

View Full Version : remove کردن یک div


tux-world
سه شنبه 26 بهمن 1389, 08:25 صبح
سلام. من یه دایو ایجاد کردم به این صورت :

<div class="member_tooltip" id="draggable">کاربر عزیز: &nbsp;<b>ZZZZZZZZ</b>&nbsp;خوش آمدید.<br /><span id="kill">لطفا خارج شوید.</span> </div>
حالا می خوام حدود ۱۰ - ۲۰ ثانیه دیگه محو یا از بین بره. راه حلی سراغ دارین ؟
hossin.esm
سه شنبه 26 بهمن 1389, 09:07 صبح
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="jquery-1.4.2.min.js"></script>
<script type="text/javascript">
var time=5;ثانیه
function hide()
{

$('#draggable').css('display','none');

}
setTimeout("hide()",time*1000);
</script>
</head>
<body>
<div id="draggable" style="border:#F00 thin solid;">کاربر عزیز: &nbsp;<b>ZZZZZZZZ</b>&nbsp;خوش آمدید.<br /><span id="kill">لطفا خارج شوید.</span> </div>
</body>
</html>
mehdi.mousavi
سه شنبه 26 بهمن 1389, 11:57 صبح
سلام.
می تونید بدین شکل عمل کنید:


$(function() {
setTimeout(function() {
$('#draggable').hide();
}, 20000);
});

اگر هم خواستید کلا اون Element رو از DOM Document حذف کنید، جای hide از remove استفاده کنید.

موفق باشید.

پاورقی: @hossin.esm: (http://barnamenevis.org/member.php?110750-hossin.esm)برای استفاده از تابع setTimeout نیازی نیست که یک string به اون پاس کنید! روش بهتر، استفاده از یک anonymous function هستش. به همین ترتیب، تابع hide برای مخفی کردن یک Element در نظر گرفته شده، بنابراین نیازی نیست دستی CSS مورد نظر رو تغییر بدید.
tux-world
سه شنبه 26 بهمن 1389, 15:46 عصر
از هر دو عزیز ممنونم. مشکلم الان اینه که هر بار که صفحه رفرش میشه باز هم با اینکه remove کردم نشون داده میشه.
mehdi.mousavi
سه شنبه 26 بهمن 1389, 16:05 عصر
از هر دو عزیز ممنونم. مشکلم الان اینه که هر بار که صفحه رفرش میشه باز هم با اینکه remove کردم نشون داده میشه.

سلام.
وقتی یه درخواست به سرور ارسال میشه، شما کد HTML ای (بعنوان نمونه) دریافت می کنید. این کد HTML سپس توسط jQuery (یا دیگر JavaScript Framework ها) تغییر میکنه، Element ای حذف میشه، Element ای جاش در DOM Document تغییر میکنه و ... و سپس، کاربر با زدن دکمه (یا لینک و ...) سرور رو از درخواست جدید خودش مطلع میکنه. سرور، هیچ اطلاعی از تغییراتی که شما توسط JavaScript در DOM Document داده اید نداره، بنابراین وقتی درخواست جدید رو پردازش میکنه، همون HTML قبلی رو Render میکنه و در نتیجه، Element حذف شده مجددا نمایش داده میشه، Element ای که جایگاهش در DOM Tree تغییر کرده بود به سر جاش برمیگرده و ... بنابراین این روند کاملا طبیعی هستش.

حالا شما برای رفع این مشکل چند راه پیش رو دارید:


یک راه این هستش که از Full Postback پرهیز کنید. در حقیقت زدن اون کلید (یا لینک) خاص، باعث ارسال درخواست به سرور و دریافت اطلاعاتی بصورت JSON، XML و ... بشه. سپس این اطلاعات توسط JavaScript در DOM Tree قرار بگیرن و ... اینطوری دیگه Element حذف شده به حالت قبلی خودش برنمیگرده.
روش دیگه این هستش که شما Full Postback داشته باشید، اما این اطلاع رو که فلان Element حذف شده سمت Client نگهدارید، تا پس از دریافت HTML جدید در سمت Client، از روی اون اطلاع، Element مزبور رو مجددا حذف کنید. این کار به سادگی نگهداشتن متغیر bool ای در Cookie و بررسی Cookie ی مزبور در Ready Handler میسره.
روش دیگه این هستش که شما سرور رو از حذف شدن اون Element مطلع کنید تا از این اطلاعات در Render بعدی (و در نتیجه عدم رندر Element حذف شده) استفاده کنه.
و ...

در هر حال، انتخاب یکی از این روشها بستگی به پیچیدگی کاری داره که در حال انجام اون هستید. ممکنه روش اول همه جا مقرون به صرفه نباشه، اما همواره از Performance بالاتری نسبت به دیگر روشها برخورداره.

موفق باشید.
tux-world
سه شنبه 26 بهمن 1389, 17:08 عصر
فکر کنم بتونم با کوکی بنویسم. حالا اجازه بدید سعیمو برای نوشتن بکنم جایی گیر کردم می پرسم. باز هم سپاسگذارم