اذهب إلى المحتوى

السؤال

نشر

لدي كود الصفحة التالية، بلغة 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');
});

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

Recommended Posts

  • 0
نشر

ببساطة :

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

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

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

 

انضم إلى النقاش

يمكنك أن تنشر الآن وتسجل لاحقًا. إذا كان لديك حساب، فسجل الدخول الآن لتنشر باسم حسابك.

زائر
أجب على هذا السؤال...

×   لقد أضفت محتوى بخط أو تنسيق مختلف.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   جرى استعادة المحتوى السابق..   امسح المحرر

×   You cannot paste images directly. Upload or insert images from URL.

  • إعلانات

  • تابعنا على



×
×
  • أضف...