JavaScript Code for Showing and Hiding Multiple Divs

Hello! It looks like you’re trying to show and hide multiple divs using multiple buttons in JavaScript. Your code seems mostly correct, but there are a few things you can check to ensure it works as expected:

1. jQuery: Make sure you have included the jQuery library in your HTML file. You can do this by adding the following line before your script tag:

   مقالات ذات صلة

   • استكشاف لغات البرمجة الرائدة في عالم التطوير البرمجي

     20/01/2024
   • تطوير تطبيقات الويب باستخدام Visual Studio 2015

     11/04/2024
   • كيفية العثور على موقع JavaScript

     13/04/2024
   • إنشاء تأثير تحويم متحرك باستخدام JavaScript: دليل العمليات والأسرار

     24/02/2024

   htmlCopy code
   <script src="https://code.jquery.com/jquery-3.6.0.min.js">script>
   

2. Data Attributes: Ensure that the data-target attribute in each .menu-item div matches the class of the corresponding div you want to show/hide.

3. CSS: You may need to add some CSS to initially hide the divs. You can do this by adding the following style:

   cssCopy code
   .menu-toggle {
     display: none;
   }
   

With these adjustments, your code should work as expected. If you’re still having trouble, please let me know, and I’ll be happy to help further!

بالتأكيد! يبدو أنك تستخدم jQuery لإظهار وإخفاء عناصر الـ div باستخدام أزرار متعددة. في الكود الذي قدمته، تقوم بتعريف متغير $bgs لتحديد جميع العناصر التي تحمل الفئة .menu-toggle، ثم تستجيب لحدث النقر على العناصر التي تحمل الفئة .menu-item لتبديل عرض العنصر المستهدف (الذي يتم تحديده باستخدام السمة data-target) وإخفاء العناصر الأخرى.

إذا كنت تواجه مشكلة مع هذا الكود، يمكن أن تكون المشكلة في التكامل مع jQuery أو في تعريف الأحداث. يمكنك التحقق من النقاط التالية:

1. التأكد من تضمين jQuery: تأكد من أنك قمت بتضمين مكتبة jQuery في ملف HTML الخاص بك كما ذكرت في الإجابة السابقة.

2. التأكد من تعريف الأحداث بشكل صحيح: تأكد من أن الكود JavaScript الخاص بك يتم تنفيذه بعد تحميل المستند بالكامل. يمكنك فعل ذلك عن طريق وضع الكود داخل كتلة $(document).ready():

   javascriptCopy code
   $(document).ready(function() {
     // Your code here
   });
   

3. التأكد من تعريف CSS: تأكد من أن لديك قواعد CSS كافية لإخفاء العناصر المستهدفة في البداية:

   cssCopy code
   .menu-toggle {
     display: none;
   }
   

4. التأكد من استخدام أحدث إصدار من jQuery: قد تواجه مشاكل إذا كنت تستخدم إصدارًا قديمًا من jQuery. حاول استخدام أحدث إصدار متاح.

إذا كنت ما زلت تواجه مشكلة، يمكنك مشاركة تفاصيل إضافية حول الخطأ الذي تواجهه لأتمكن من مساعدتك بشكل أفضل.