راهنمایی درباره این کد

[behnambest2000]

سلام
من با دستور toggle یک div رو hide و show می کنم . اما یه مشکلش اینجاست که فقط روی اون سلکتور مورد نظر باید کلیک کنیم تا مخفیش کنیم . من میخوام به غیر از اون هر جای صفحه که کلیک کردم اگر div ما show بود اون رو hide کنه .

با تشکر

<script>
$(document).ready(function(){
$("div.btn").click(function(){
$("#container").toggle(300);
});
});
</script>

[Javidhb]

$('html').click(function() {
$('#container').toggle(300);
});


$('#container').click(function(event){
event.stopPropagation();
});



اول یه event برای کل html مینویسید... که با کلیک div#container رو show یا hide کنه.
اما توی قسمت دوم میاید میگید که اگه روی خود div#container کلیک شد... توقف کنه و دیگه نرو eventهای مربوط به المنتهای والد رو بررسی کن.

بدون قسمت دوم در واقع با کلیک روی خود div#container جاوااسکریپت میاد تمام eventهای المنتهای والد رو چک میکنه که html هم شاملش میشه! و با توجه به تعریف toggle برای المنت html، عمل toggle اتفاق می افته(چون html المنت والد div#container هست) ولی با stopPropagation اون مرحله چک کردن المنتهای والد و اجرای eventهاشون اتفاق نمی افته..


http://api.jquery.com/event.stopPropagation/ (http://api.jquery.com/event.stopPropagation/)
https://developer.mozilla.org/en-US/docs/Web/API/event.stopPropagation
http://www.w3schools.com/jquery/event_stoppropagation.asp

[behnambest2000]

داداشدستت درد نکنه ولی من هرجای صفحه که کلیک میکنم این بازو بسته میشه

http://www.uploadax.com/images/93244449905519745913.png

http://www.uploadax.com/images/54598217907592907940.png

[Javidhb]

عجیبه.... دمو رو ببین و یه تست دیگه هم بکن... مطمئن شو که اسمها و ... درسته.

دمـــــــو (http://jsfiddle.net/H6xMY/)



$('html').click(function() {
//تست کردم بودن شرط هم کار کرد!!!
$('#container').hide(300);
});

$('#container').click(function(event){

event.stopPropagation();
});

$("div.btn").click(function(event){
$("#container").toggle(300);

event.stopPropagation();
});

[behnambest2000]

دمت گرم داد . کده درسته