باستخدام وظيفة تبديل jQuery على صف الجدول يجعل الجدول نفسه ينمو

StackOverflow https://stackoverflow.com/questions/1256146

  •  12-09-2019
  •  | 
  •  

سؤال

أنا أستخدم تأثير جيس تبديل مدمن مخدرات في حدث انقر () صف واحد جدول واحد لتبديل رؤية الصف التالي (والذي يحدث أيضا أن يكون الصف الأخير في الجدول). إذا قمت بالنقر فوق صف إطلاق النار عدة مرات في تتابع، فإن الجدول الذي يحتوي على الصفوف 2 ينمو قليلا في كل مرة يظهر صف التبعية.

إليك JQUERY أنا أستخدم:

$(document).ready(function() {
    $(".sectionhead").click( function() {
        $(this).next("tr").toggle("150");
    });
});

لذلك بعد قليل من التكرار، الجدول (الذي يحتوي على صف Tr.Section فقط المرئي فيه) كبير جدا.

هل هناك طريقة مدمجة يمكنني تجنب هذا السلوك، أو هل هناك طريقة للقيام بذلك في مسج سيكون أسهل مما أفعله؟

يحرر

الحل الفعلي الذي اقترحه إجابة Scotte أدناه (لا أريد أن أضطر إلى فئة TR أنا تبديل، وسوف يكون مرئيا للبدء في):

$(document).ready(function() {
    $(".sectionhead").toggle(
        function() {
            $(this).next("tr").hide();
        },
        function() {
            $(this).next("tr").show();
        }
    )
});
هل كانت مفيدة؟

المحلول

هناك بعض الغرابة بين المتصفحات المختلفة مع TGGLING TRS. إذا وضعت حدود = "1" في الجدول في FF، فسترى كيف يعمل البداية (أو لا) كما لديك مشفرة حاليا.

إذا ذهبت مع تبديل (FN، FN) يبدو أنه يعمل في FF و IE7. IE8 يمكن أن تكون قصة مختلفة - لذلك تحقق من ذلك أيضا. jQuery. Toggle () لا يعمل مع TRS في IE يظهر حل إذا كان هذا هو الحال.

التالي يفترض أن TFOOT TR {عرض: لا شيء؛ } موجود في CSS الخاص بك.

$(function() {

    var $tr = $("tfoot tr");

    $(".sectionhead").toggle(
        function() {
            $tr.show();
        },
        function() {
            $tr.hide();
        }
    );

});

نصائح أخرى

لا أعتقد أنك تريد استخدام التبديل () كما سيتم تبديل طريقة العرض () وتعيين عرض العنصر إلى "كتلة". في هذه الحالة، أعتقد أنك تريد أن يكون لديك شيء آخر مزيد من العرف الذي سيقوم بتعيين عرض TR إلى "جدول الجدول".

مرخصة بموجب: CC-BY-SA مع الإسناد
لا تنتمي إلى StackOverflow
scroll top