پنهان و نمایان کردن عناصر در jQuery – درس شانزدهم


برای خواندن کامل مطلب به سایت سر بزنید . آنجا کد ها و تصوایر کاملا خوانا ترند !
https://www.spadan.net/

آموزش قواعد دستوری جی کوئری

پنهان و نمایان کردن عناصر در جی کوئری

در یکی دیگر از آموزش های جی کوئری همراه شما هستیم و می خواهیم به شما نحوه استفاده از بعضی از کدهای کتابخانه زیبای جی کوئری را آموزش دهیم. طراحان وب سایت با کتابخانه جی کوئری آشنای کامل دارند. در این آموزش دستور پنهان و نمایان کردن عناصر در jQuery را به شما معرفی می کنیم، که برای هر طراح وب بسیار مفید خواهد بود.

در صورتی که با جی کوئری آشنایی کامل ندارید ، با آموزش های قدم به قدم جی کوئری و از درس اول آموزش جی کوئری شروع نمایید.

 

متد data متد removedata

 

افکت های جی کوئری

استفاده جاوا اسکریپت و کتابخانه مرتبط با آن نظیر جی کوئری (jQuery) و دیگر کتابخانه ها در طراحی  سایت بسیار پرکاربرد می باشد و باعث بهبود رابط کاربری سایت با کاربران می شود. قطعه کد اسکریپت که در جی کوئری بسیار مورد استفاده قرار می گیرد ، پنهان و نمایان کردن عناصر در jQuery یا تگ های موجود در صفحه وب است.

استفاده از متدهای  show()و  hide()

افکت های  hide و show نیز برای پنهان و نمایان کردن عناصر در jQuery به کار می رود. شما می توانید عناصر داخل صفحه وب را با متدهای  hide و show مخفی و نمایش کنید.

نکته: اگر می خواهید عمل مخفی کردن و نمایش دادن با مدت زمانی مشخص انجام شود می توانید یک زمان مشخص مانند ۱۰۰۰ میلی ثانیه در قسمت hide(1000) قرار دهید. این پارامتر بر اساس میلی ثانیه می باشد.

توجه: با کپی کردن کدهای زیر در محیط کدنویسی خود ، کدها به درستی نمایش داده می شوند.

 

<html>
<head>
<script type="text/javascript" src="http://www.spadan.net/jquery.js"> </script>
<script type="text/javascript">
 $(document).ready(function(){
  	$("#hide").click(function(){
    		$("p").hide(1000);
  	});
  	$("#show").click(function(){
    		$("p").show(1000);
  	});
});
</script>
</head>
<body dir="rtl" style="text-align: center">
<p> "Hide" کلیک کنید، برای پنهان روی دکمه  "show"برای نمایش روی دکمه .</p>
<button id="hide">Hide</button>
<button id="show">Show</button>
</body>
</html>

 

استفاده از متد toggle

یکی دیگر از متدهای که در کتابخانه جی کوئری استفاده زیادی از آن می شود متد toggle() است که برای پنهان و نمایان کردن عناصر در jQuery یا قسمتی از صفحه به کار می رود.

نکته: متد toggle()  دو عمل hide()  و show() را با هم انجام می دهد.

توضیح کد: همانطور که ملاحظه می فرمایید، عنصری یا آیدی button وقتی روی آن کلیک شد رویداد toggle() برای آیدی p1  اتفاق می افتد و مخفی یا نمایش داده می شود.

<html>
 <head>
 <script type="text/javascript" src="http://www.spadan.net/jquery.js"> </script>
 <script type="text/javascript">
  $(document).ready(function () {
 	$("# button").click(function(){
 		$("#p1").toggle();
 });
 });
 </script>
 </head>
<body>
<p> نحوه تغییر وضعیت عنصر</p>
 <button id=" button" type="button">Toggle</button>
</body>
</html>

 

در آموزش بعدی می پردازیم به محو کردن عناصر در jQuery . با ما همراه باشید.

در این قسمت می توانید دیگر آموزش های جی کوئری اسپادان را دنبال نمایید.

موفق باشید 🙂

نوشته پنهان و نمایان کردن عناصر در jQuery – درس شانزدهم اولین بار در طراحی سایت اصفهان | سئو سایت اصفهان پدیدار شد.



Source link

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

*
*

..................................................................................طراحی وب سایت , سئو وب سایت , طراحی قالب وردپرس , فروش بک لینک , فروش رپورتاژ.................................................................................. رد کردن

آفلاین

در حال حاضر نیستیم. لطفا پیام خود را ارسال کنید, در اولین فرصت رسیدگی میکنیم. با تشکر : تیم پشتیبانی اسپادان

هر سولی دارید بپرسید.

شروع چت