jQuery中的批量删除以及即点即改原理及实现

即点即改关键在于取到父节点的id值 来根据id去修改

示例：

这是一个基本的循环的表格

<input type="button" value="批量删除" class="ui_input_btn01" id="dels" />

<tr>
<th width="30"><input type="checkbox" id="all" />
</th>
<th>位置</th>
<th>房源</th>
<th>房源面积</th>
<th>户型</th>
<th>带看次数</th>
<th>
4000
时间</th>
<th>价格</th>
<th>状态</th>
<th>操作</th>
</tr>

<tbody id="search"><?php foreach($model as $key=>$val){?> <tr id="<?php echo $val['h_id']?>"> <td><input type="checkbox" class="che" name="check" value="<?=$val['h_id']?>"/></td> <td><?= $val['address']; ?></td> <td><?= $val['name']; ?></td> <td><?= $val['area']; ?></td> <td><?= $val['a_name']; ?></td> <td><?= $val['desc'];?></td> <td><?= $val['time']; ?></td> <td><?= $val['price']; ?></td> <td> <?php if($val["state"]==0) { echo "<span >未出租</span>"; }else { echo "<span >已出租</span>"; } ?> </td> <td> <a href="javascript:void(0);" id="update" title="<?=$val['h_id']?>">编辑</a> <a href="javascript:void(0);" id="del" title="<?=$val['h_id']?>">删除</a> </td> </tr>
修改

$(document).on("click","span",function () {
var _this =  $(this);
var text = _this.html();
var id=_this.parents("tr").attr('id');
var state='';
if(text=='未出租')
{
_this.text("已出租");
state=1;
}
else
{
_this.text("未出租");
state=0;
}
$.ajax({
type: "get",
data: {state:state,id:id},
url:"?r=user/upstate",
success: function(msg)
{
这部分是要传的后台根据状态 id 来进行修改 实现正真的改。
}
})
})

全反选

根据属性去选择,

$(document).on("click","#all",function()
{
if(this.checked)
{
$(".che").prop("checked", true);
}else
{
$(".che").prop("checked", false);
}
})

反选

$("#fan").click(function () {
$(".a:checkbox").each(function () {
$(this).prop("checked", !$(this).prop("checked"));
});
})
批量删除

$("#dels").click(function(){
//    alert("ds");
var checkedNum = $("input[name='ch
a9e4
eck']:checked").length;
if(checkedNum == 0) {
alert("请选择至少一项！");
return;
}
// // 批量选择
if(confirm("确定要删除所选项目？")) {
var che = $("input[name='check']:checked");
//              alert(che)
var hh = new Array();
for(var a=0;a<che.length;a++){
hh[a] = che[a].value;
}
$.ajax({
type: "POST",
url: "?r=user/dels",
data: {'delitems':hh},
success: function(result) {
alert("删除成功");
}
});
}
});