• 0

كيف أحذف الأسطر الحاوية على Class عند الضغط على سطر ؟

لدي كود الصفحة التالية، بلغة Html، والمكون لجدول:

<table class="table">
<tr>
    <th>Name</th>
    <th>Surname</th>
    <th></th>
</tr>
<tr>
    <td>name 1</td>
    <td>surname 1</td>
    <td>actions</td>
</tr>
<tr>
    <td>name 2</td>
    <td>surname 3</td>
    <td>actions</td>
</tr>
</table>

ما أريده هو عند تحديد سطر ما على الجدول يتم تحديد وإضافة الكلاسselected ، ثم بعد ذلك عند الضغط مرة أخرى على أي سطر تُحذف الأسطر التي تحتوي على هذا الكلاس 'selected'، وبعد بعض البحث خلصت إلى كود Jquery:

$('tr').not(':first').click(function () {
    var table = $(this).closest("table");
    var rows = table.children("tr");
    alert(rows.length);
    rows.each(function () {
        $(this).removeClass("selected");
    });

    $(this).addClass('selected');
});

لكن لا أدري ما الخطأ في ذلك؟

انشر على الشّبكات الاجتماعية


رابط هذه المساهمة
  • 0

ببساطة :

  • عند الضغط على أي عمود سنقوم بأمرين اثنين على التوالي:
  1. إضافة الكلاس إلى العنصر المضغوط عليه.
  2. حذف وإزالة العناصر المتوفرة على الكلاس السابق.

يمكن تطبيق ما سبق ذكره عن طريق Jquery:

$('tr').not(':first').click(function () {
  $(this).addClass("selected"); //إضافة كلاس إلى العنصر المضغوط عليه
  $(this).siblings().removeClass( "selected" ); //إزالة العناصر المتوفرة على الكلاس المعينة
});

 

انشر على الشّبكات الاجتماعية


رابط هذه المساهمة

يجب أن تكون عضوًا لدينا لتتمكّن من التعليق

انشاء حساب جديد

يستغرق التسجيل بضع ثوان فقط


سجّل حسابًا جديدًا

تسجيل الدخول

تملك حسابا مسجّلا بالفعل؟


سجّل دخولك الآن