Zusammenfassung der jQuery-Operationstabellenmethoden

Dieses Mal werde ich Ihnen eine Zusammenfassung der jQuery-Operationsmethode geben. Was sind die Vorsichtsmaßnahmen für die jQuery-Operation von Table?

1. Die Zeile ändert ihre Farbe, wenn sich die Maus bewegt

Methode 1: hover(fun(), fun())-Methode in jQuery, Parameter 1: erste Methode Es dient zum Hinzufügen der Stilfunktion, Parameter zwei: Die zweite Methode besteht darin, die Stilfunktion abzubrechen

$("#table1 tr").hover(function(){
$(this).children("td").addClass("hover")
},function(){
$(this).children("td").removeClass("hover")
})

Methode zwei:

$("#table1 tr:gt(0)").hover(function() {
$(this).children("td").addClass("hover");
}, function() {
$(this).children("td").removeClass("hover");
});

2 verschiedene Farben haben

$("#table1 tbody tr:odd").css("background-color", "#bbf");
$("#table1 tbody tr:even").css("background-color","#ffc");
$("#table1 tbody tr:odd").addClass("odd")
$("#table1 tbody tr:even").addClass("even")

3. Eine Zeile ausblenden

$("#table1 tbody tr:eq(3)").hide();

Eine Spalte ausblenden

Methode 1:

$("#table1 tr td::nth-child(3)").hide();

Methode 2:

$("#table1 tr").each(function(){$("td:eq(3)",this).hide()});

5. Löschen Sie eine Zeile

//删除除第一行外的所有行
$("#table1 tr:not(:first)").remove();
//删除指定行
$("#table1 tr:eq(3)").remove();

6. Eine Spalte löschen

//删除除第一列外的所有列
$("#table1 tr th:not(:nth-child(1))").remove();
$("#table1 tr td:not(:nth-child(1))").remove();
//删除第一列
$("#table1 tr td::nth-child(1)").remove();

7. Den Wert einer bestimmten Zelle abrufen (festlegen)

//设置table1,第2个tr的第一个td的值。
$("#table1 tr:eq(1) td:nth-child(1)").html("value");
//获取table1,第2个tr的第一个td的值。
$("#table1 tr:eq(1) td:nth-child(1)").html();

8. Fügen Sie eine Zeile ein:

//在第二个tr后插入一行
$("a34de1251f0d9fe1e645927f19a896e8b6c5a531a458a2e790c1fd6421739d1c插入3b90dd5946f0946207856a8a37f441edfb6c5a531a458a2e790c1fd6421739d1c插入b90dd5946f0946207856a8a37f441edfb6c5a531a458a2e790c1fd6421739d1c插入b90dd5946f0946207856a8a37f441edfb6c5a531a458a2e790c1fd6421739d1c插入b90dd5946f0946207856a8a37f441edffd273fcf5bcad3dfdad3c41bd81ad3e5").insertAfter($("#table7 tr:eq(1)"));

9. Holen Sie sich den Wert der angegebenen Zelle in jeder Zeile

var arr = [];
$("#table1 tr td:nth-child(1)").each(function (key, value) {
arr.push($(this).html());
});
var result = arr.join(',');

10. Alle auswählen oder alle deaktivieren

//方法一：
//全选或全不选 此传入的参数为event 如：checkAll(event)
function checkAll(evt)
{
 evt=evt?evt:window.event;
 var chall=evt.target?evt.target:evt.srcElement;
 var tbl=$("#table1");
 var trlist=tbl.find("tr");
 for(var i=1;ib70062b4eb140f2c4544a106eac09c5d";
var text="495cbffaef69ee8c8599694f57079abb";
var sel="07dd84e2b63e2bf9d1512db3dcd37ce8a97732aa835093708c3240487f4db46b男4afa15d3069109ac30911f04c56f333833b75806bd15fdc75e33f3c4299337a5女4afa15d3069109ac30911f04c56f333818bb6ffaf0152bbe49cd8a3620346341";
var row="a34de1251f0d9fe1e645927f19a896e8b6c5a531a458a2e790c1fd6421739d1c"+chk+"b90dd5946f0946207856a8a37f441edfb6c5a531a458a2e790c1fd6421739d1c"+text+"b90dd5946f0946207856a8a37f441edfb6c5a531a458a2e790c1fd6421739d1c"+sel+"b90dd5946f0946207856a8a37f441edfb6c5a531a458a2e790c1fd6421739d1c"+text+"b90dd5946f0946207856a8a37f441edfb6c5a531a458a2e790c1fd6421739d1c"+text+"b90dd5946f0946207856a8a37f441edffd273fcf5bcad3dfdad3c41bd81ad3e5";
$(row).insertAfter($("#table1 tr:eq("+rownum+")"));
}
//客户端删除一行
//每次只能删除一行，删除多行时出错
function btnDeleteRow()
{
$("#table1 tr").find("input[type='checkbox']").each(function(i){
if($(this).attr("checked"))
{
if(i!=0)//不能删除行标题
{
$("#table1 tr:eq("+i+")").remove();
}
}
});
}
//这个比上面的要好，可以一下删除多个记录
function btnDeleteRow()
{
$("#table1 tr").each(function(i){
var chk=$(this).find("input[type='checkbox']");
if(chk.attr("id")!="checkall")//不能删除标题行
{
if(chk.attr("checked"))
{
$(this).remove();
}
}
});
}
//客户端保存
function btnSaveClick()
{
//find()方法中我暂时不知道如何设定多个筛选条件，所以下面得不到select列表的值
//$("#table1 tr td").find("input[type='text']" || "select").each(function(i){
//alert($(this).val());
//});
$("#table1 tr").find("td").each(function(i){
if($(this).find("input[type='text']").length>0)
{
alert($(this).find("input[type='text']").val());
}
else if($(this).find("select").length>0)
{
alert($(this).find("select").val());
}
});
}

46d5fe1c7617e3914f214aaf043f4ccf
.hover
{
  background-color:red;
}
531ac245ce3e4fe3d50054a55f265927
23fe0263b682d11b6362f7fdc28ca899
a34de1251f0d9fe1e645927f19a896e8
b4d429308760b6c2d20d6300079ed38e
49ccdbc9f3ee0ff64f125f7048b1013e
01c3ce868d2b3d9bce8da5c1b7e41e5b
b4d429308760b6c2d20d6300079ed38e姓名01c3ce868d2b3d9bce8da5c1b7e41e5b
b4d429308760b6c2d20d6300079ed38e性别01c3ce868d2b3d9bce8da5c1b7e41e5b
b4d429308760b6c2d20d6300079ed38e密码01c3ce868d2b3d9bce8da5c1b7e41e5b
b4d429308760b6c2d20d6300079ed38e地址01c3ce868d2b3d9bce8da5c1b7e41e5b
fd273fcf5bcad3dfdad3c41bd81ad3e5
a34de1251f0d9fe1e645927f19a896e8
b6c5a531a458a2e790c1fd6421739d1c
36db48e7b0e50b08f213c41a030d94b4
b90dd5946f0946207856a8a37f441edf
b6c5a531a458a2e790c1fd6421739d1c张三b90dd5946f0946207856a8a37f441edf
b6c5a531a458a2e790c1fd6421739d1c男b90dd5946f0946207856a8a37f441edf
b6c5a531a458a2e790c1fd6421739d1czhangsanb90dd5946f0946207856a8a37f441edf
b6c5a531a458a2e790c1fd6421739d1c上海b90dd5946f0946207856a8a37f441edf
fd273fcf5bcad3dfdad3c41bd81ad3e5
a34de1251f0d9fe1e645927f19a896e8
b6c5a531a458a2e790c1fd6421739d1c
2e6cd4897d4afca4f7438be274076cf6
b90dd5946f0946207856a8a37f441edf
b6c5a531a458a2e790c1fd6421739d1c李四b90dd5946f0946207856a8a37f441edf
b6c5a531a458a2e790c1fd6421739d1c男b90dd5946f0946207856a8a37f441edf
b6c5a531a458a2e790c1fd6421739d1clisib90dd5946f0946207856a8a37f441edf
b6c5a531a458a2e790c1fd6421739d1c安庆b90dd5946f0946207856a8a37f441edf
fd273fcf5bcad3dfdad3c41bd81ad3e5
a34de1251f0d9fe1e645927f19a896e8
b6c5a531a458a2e790c1fd6421739d1c
57aa45e773995a8e992982069ac5a8e6
b90dd5946f0946207856a8a37f441edf
b6c5a531a458a2e790c1fd6421739d1c王五b90dd5946f0946207856a8a37f441edf
b6c5a531a458a2e790c1fd6421739d1c男b90dd5946f0946207856a8a37f441edf
b6c5a531a458a2e790c1fd6421739d1cbeijingb90dd5946f0946207856a8a37f441edf
b6c5a531a458a2e790c1fd6421739d1c北京b90dd5946f0946207856a8a37f441edf
fd273fcf5bcad3dfdad3c41bd81ad3e5
a34de1251f0d9fe1e645927f19a896e8
b6c5a531a458a2e790c1fd6421739d1c
cb156e62e5bb9a6cb22524d4b6241bf1
b90dd5946f0946207856a8a37f441edf
b6c5a531a458a2e790c1fd6421739d1c无名氏b90dd5946f0946207856a8a37f441edf
b6c5a531a458a2e790c1fd6421739d1c女b90dd5946f0946207856a8a37f441edf
b6c5a531a458a2e790c1fd6421739d1cwumingshib90dd5946f0946207856a8a37f441edf
b6c5a531a458a2e790c1fd6421739d1c上海b90dd5946f0946207856a8a37f441edf
fd273fcf5bcad3dfdad3c41bd81ad3e5
a34de1251f0d9fe1e645927f19a896e8
b6c5a531a458a2e790c1fd6421739d1c
2559f9a95ac0befe6e3d6524e2c16d4c
b90dd5946f0946207856a8a37f441edf
b6c5a531a458a2e790c1fd6421739d1c赵老师b90dd5946f0946207856a8a37f441edf
b6c5a531a458a2e790c1fd6421739d1c男b90dd5946f0946207856a8a37f441edf
b6c5a531a458a2e790c1fd6421739d1czhaolaoshib90dd5946f0946207856a8a37f441edf
b6c5a531a458a2e790c1fd6421739d1c浙江b90dd5946f0946207856a8a37f441edf
fd273fcf5bcad3dfdad3c41bd81ad3e5
a34de1251f0d9fe1e645927f19a896e8
e77292f32b245f9a9aba5a990432da2e
669c4eb54fb78d1b3d4aa7a1c658e5fc
ff07c8a390de24e525254ac6b7c0d999
db3b1f4cf55b52b93946e09641b0d544
b90dd5946f0946207856a8a37f441edf
fd273fcf5bcad3dfdad3c41bd81ad3e5
f16b1740fad44fb09bfe928bcc527e08

Ich glaube, Sie haben es gemeistert, nachdem Sie den Fall in diesem Artikel gelesen haben. Weitere spannende Methoden finden Sie in anderen verwandten Artikeln auf der chinesischen PHP-Website!

Empfohlene Lektüre:

Zusammenfassung der Jquery-Operationsobjekt-Array-Element-Methode (mit Groß-/Kleinschreibung)

zu implementierende grep()-Methode Array-Filter

Das obige ist der detaillierte Inhalt vonZusammenfassung der jQuery-Operationstabellenmethoden. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!