المساعد الشخصي الرقمي

مشاهدة النسخة كاملة : [جافا سكربت] درس مفصل اخفاء جدول واظهاره باستخدام الجافا سكربت



admin
11-01-2013, بتوقيت غرينيتش 04:06 PM
http://www.dzbatna.com/images/icons/iconrote.gif [ط¬ط§ظپط§ ط³ظƒط±ط¨طھ] ط¯ط±ط³ ط§ط®ظپط§ط، ط¬ط¯ظˆظ„ ط§ظˆ div ط§ظˆ ط§ظٹ element ظˆط§ط¸ظ‡ط§ط±ظ‡ ط¨ط§ط³طھط®ط¯ط§ظ… ط§ظ„ط¬ط§ظپط§ ط³ظƒط±ط¨طھ (http://www.dzbatna.com/t1427309/)



السلام عليكم ورحمة الله وبركاته
اخواني الكرام ، اليوم اقدم كود code بسيط يقوم باخفاء واظهار جدول او التقسيمات div او اي وسم تحدده بhtml بالضغط على اي element انت تحددها


توضيح


في البداية احب ان اوضح ان الكود code يقوم بعمل الكود code الموجود في الفي بولتن المسؤول عن اظهار واخفاء قوائم التحكم على يمين اللوحة
الموضحة بالصورة التالية
http://www.dzbatna.com/attachments/440271d1262184227-untitled.jpg


كما احب ان اوض ان الكود code ليس من برمجتي
وانما استخدمه كثيرا في لوحات التحكم التي ابرمجها



الكود code

رمز Code:
<script language=&quot;javascript&quot; type=&quot;text/javascript&quot;>
رمز Code:

function show_hide(tblid, show) {
if (tbl = document.getElementById(tblid)) { if (null == show) show = tbl.style.display == 'none'; tbl.style.display = (show ? '' : 'none'); } } </script>




هذا الكود code الصغير سيقوم بالمهمة بشكل قوي وبدون اخطاء


الان نأتي لعملية شرح طريقة الاستخدام


قم بتضمين الكود code اعلاه في وسم الهيد head في الصفحة التي تريدها.


في الوسم body عليك تحديد جميع الجداول التي سيتم اخفاءها عند تحميل الصفحة كما يظهر في الكود code التالي . رمز PHP:

<code style="white-space:nowrap"> <code> <body onload="show_hide('t1'),show_hide('t2')">
</code> </code>




الان عند اختيار الاداة المسؤولة عن الاظهار والاخفاء نضيف لها اكشن عند الضغط عليها كالتالي رمز PHP:

<code style="white-space:nowrap"> <code> <img border="0" src="images/icon.png" width="16" height="16" onclick="show_hide('t1')">
</code> </code>

في حالتنا هذه وضعنا صورة مسؤولة عن الاظهار والاخفاء


فقط هذه هي العملية

اذا واجهت صعوبة في التطبيق ما عليك سوى تحميل الملف المرفق
فهو يحتوي على مثال حي
فقط قم بتأمله وطريقة تركيب installه وسترى انها سهل جدا


وايضا للتسهيل هذا الكود code كامل للملف
رمز PHP:

<code style="white-space:nowrap"> <code> <html>
</code> </code>



رمز PHP:

<code style="white-space:nowrap"> <code> &#91;RIGHT&#93;<head>
<meta http-equiv="Content-Language" content="ar-jo">
<meta http-equiv="Content-Type" content="text/html; charset=windows-1256">
<script language="javascript" type="text/javascript">
function show_hide(tblid, show) {
if (tbl = document.getElementById(tblid)) {
if (null == show) show = tbl.style.display == 'none';
tbl.style.display = (show ? '' : 'none');
}



}
</script>
</head>
<body onload="show_hide('t1')">
<div align="center">
<table border="1" width="50%" id="t1" cellspacing="1">
<tr>
<td bordercolor="#808080" bgcolor="#C0C0C0">
<p align="center"><b><font face="Tahoma" style="font-size: 11pt">ملاحظة</font></b></td>
</tr>
<tr>
<td bgcolor="#C9EBF5">
<p align="center">
<font face="Tahoma" style="font-size: 11pt; font-weight: 700">تقبلوا هذا
الشرح طريقة البسيط من اخوكم مهند </font></p>
<p align="center">
<font face="Tahoma" style="font-size: 11pt; font-weight: 700">الى جميع
اعضاء ومبرمجين معهد كل العرب معهد ديزاد باتنة</font></td>
</tr>
</table>
</div>
<p align="center">
<a href="#" onclick="show_hide('t1')">اظهار اخفاء</a>
</p>
</body>
</html>&#91;/RIGHT&#93;
</code> </code>




بالتوفيق للجميع

وحياكم الله
وانتظروني في دروس قادمة باذن الله







التعديل الأخير كان بواسطة Hudaislam; 30 - 12 - 2014 الساعة 21:37

ألعاب الأندرويد مجانا و حصريا (http://www.apotox.info/forum)


الملفات المرفقة
http://www.traidnt.net/vb/images/attach/zip.gif index.zip (http://www.traidnt.net/vb/attachments/440274d1262185000-index.zip) (705 بايت, عدد مرات المشاهدة 165 مرة)


https://fbcdn-sphotos-d-a.akamaihd.net/hphotos-ak-ash4/482113_236967293114455_1193518507_n.png (http://www.dzbatna.com)
©المشاركات المنشورة تعبر عن وجهة نظر صاحبها فقط، ولا تُعبّر بأي شكل من الأشكال عن وجهة نظر إدارة المنتدى (http://www.dzbatna.com)©

استعمل مربع البحث في الاسفل لمزيد من المواضيع


سريع للبحث عن مواضيع في المنتدى