Single-line deletion of table contents, single-line selection, multiple-row selection, select all, deselect, delete selected rows, and more
HTML code
<table class= "Table table-bordered Border-shadow" ><colgroup> <col class= "col-xs-1" > <co L class= "col-xs-1" > <col class= "col-xs-4" > <col class= "col-xs-4" > <col class= "col-x S-2 "> </colgroup><thead><tr><th style=" width:5% "> select </th> <th style=" width:5% "& gt; serial number </th><th style= "width:35%" > Content </th><th style= "width:35%" > Picture </th><th style= " width:20% "> Operation </th></tr></thead><tbody id=" Tab_lisy "><tr><td><div class = "checkbox" style= "padding-left:30px;" > <label> <input type= "checkbox" value= "0" > </label> </div></td ><td></td><td></td><td></td><td><button class= "Btn btn-success Del_line "type=" button "> Delete </button><button class=" btn btn-success "type=" button "> Ignore </button> </td></tr>&lT;tr><td><div class= "checkbox" style= "padding-left:30px;" > <label> <input type= "checkbox" value= "0" > </label> </div></td& Gt;<td></td><td></td><td></td><td><button class= "Btn btn-success del _line "type=" button "> Delete </button><button class=" btn btn-success "type=" button "> Ignore </button>< /td></tr><tr><td><div class= "checkbox" style= "padding-left:30px;" > <label> <input type= "checkbox" value= "0" > </label> </div></td ><td></td><td></td><td></td><td><button class= "Btn btn-success Del_line "type=" button "> Delete </button><button class=" btn btn-success "type=" button "> Ignore </button> </td></tr><tr><td><div class= "checkbox" style= "padding-left:30px;" > <label> <input type= "checkbox" value= "0" > </label> </div></td><td></td><td></td> <td></td><td><button class= "btn btn-success del_line" type= "button" > Delete </button>< Button class= "btn btn-success" type= "button" > Ignore </button></td></tr></tbody></table ><div><button class= "btn btn-success" id= "All_line" type= "button" > select All </button><button class= "Btn btn-success" id= "Del_all_line" type= "button" > Delete </button></div>
jquery Code
//single-row deletion$ (". Del_line"). Click (function(){ $( This). Parents ("tr"). empty ();});//Select all, reverse selectvarLine=1;$("#all_line"). On ("click",function() { if(line==1) { $("#tab_lisy"). Find (": CheckBox"). Prop ("Checked",true). Val ("1"); $( This). Text ("Inverse selection"); Line=0; }Else{ $("#tab_lisy"). Find (": CheckBox"). Prop ("Checked",false). Val ("0"); $( This). Text ("Select All"); Line=1; }});//Radio$ ("#tab_lisy"). Find (": CheckBox"). On ("click",function() { if($( This). Val () ==0){ $( This). Prop ("Checked",true). Val ("1"); }Else{ $( This). Prop ("Checked",false). Val ("0"); }});//Delete all the selected$ ("#del_all_line"). On ("click",function(){ $("#tab_lisy"). Find (": checkbox[value=1]"). Parents ("tr"). empty (); });
"jquery" A simple single, multi-select, select All, reverse, delete the small function