Rumah >hujung hadapan web >tutorial js >Bagaimana untuk menyembunyikan tr jadual dalam jquery
Cara menyembunyikan tr dalam jadual dalam jquery: 1. Gunakan penyataan "$(".tr class name") untuk mendapatkan objek mengikut nilai kelas yang ditentukan 2. Gunakan kaedah hide(). untuk menyembunyikan objek yang diperoleh , sintaks ialah "$(".tr class name").hide();".
Persekitaran pengendalian tutorial ini: sistem Windows 7, versi jquery 1.10.0, komputer Dell G3.
Cara jquery menyembunyikan tr dalam jadual
1 Cipta fail html baharu, bernama test.html, untuk menerangkan cara jquery menentukan Sama ada unsur kelihatan. Dalam fail test.html, gunakan teg jadual, tr dan td untuk membuat jadual dengan enam baris dan dua lajur Untuk memudahkan paparan, tetapkan sempadan 1px untuk jadual. Dalam fail test.html, dalam jadual jadual, tetapkan atribut kelas bahagian tr kepada aa dan tetapkan id baris terakhir kepada bb.
Dalam fail test.html, gunakan teg butang untuk mencipta dua butang, iaitu "sembunyikan tr" dan "tunjukkan tr". >
2. Dalam fail test.html, ikat peristiwa onclick pada dua butang butang masing-masing Apabila butang diklik, fungsi "hiddentr()" dan fungsi "displaytr()" dilaksanakan masing-masing.Dalam teg js, cipta fungsi hiddentr() dan fungsi displaytr() Dalam fungsi hiddentr(), dapatkan objek baris tr dengan kelas aa dan gunakan kaedah hide() untuk menyembunyikan. tr. Dalam fungsi displaytr(), dapatkan objek baris tr dengan id bb, dan gunakan kaedah show() untuk memaparkan tr.
Buka fail test.html dalam penyemak imbas, klik butang masing-masing untuk melihat kesannya. Buat fail test.html selepas mengklik Sembunyikan tr . Dalam fail, gunakan teg jadual, tr dan td untuk membuat jadual dengan enam baris dan dua lajur. Cipta dua butang butang pada masa yang sama untuk mencetuskan pelaksanaan fungsi js. Dalam teg js, cipta fungsi hiddentr() dan fungsi displaytr() Dalam fungsi hiddentr(), dapatkan objek baris tr dengan kelas aa Gunakan kaedah hide() untuk menyembunyikan tr , dapatkan id Untuk objek baris tr bb, gunakan kaedah show() untuk memaparkan tr.Untuk lebih banyak pengetahuan berkaitan pengaturcaraan, sila lawati:
Video Pengaturcaraan! !
Atas ialah kandungan terperinci Bagaimana untuk menyembunyikan tr jadual dalam jquery. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!