Html简单demo_html列表中进行编辑操作

html列表中进行编辑操作

<div class="_sort_box" style="float: left;"><?php echo $vo['remark'];?></div>
<div class="_sort_input_box" style="display:none; float: left;">
<input type="text" style="width:60px;" value="<?php echo $vo['remark'];?>" />
</div>
<div class="_edit_box" style="float: right;margin-right: 15px;">
<a class="_edit" href="javascript:void(0);" title="编辑客户备注">编辑</a>
</div>
<div class="_update_box" style="display:none;float: right;margin-right: 15px;">
<input name="plugin_id" type="hidden" value="<?php echo $vo['user']?>" />
<a class="_save" href="javascript:void(0);">保存</a>  
<a class="_cancel" href="javascript:void(0);">取消</a>
</div>

//编辑
$('._edit').click(function(){
var tr = $(this).parents('tr');
tr.find('._sort_box').hide();
tr.find('._sort_input_box').show().find('input').val(tr.find('._sort_box').html());;
tr.find('._edit_box').hide();
tr.find('._update_box').show();
});
//保存
$('._save').click(function(){
if(window.flagReq == true)return;
var plugin_id = $(this).prev('input[name=plugin_id]').val();
var tr = $(this).parents('tr');
var sort = tr.find('._sort_input_box').find('input').val();
var url = "<?php echo url('User', 'updateRemark');?>";
window.flagReq = true;
$.post(url, {openId:plugin_id,remark:sort}, function(result) {
result = eval('('+result+')');
jsAlert(result.msg,function(){
if(result.error == 0){
tr.find('._sort_box').show().html(sort);
tr.find('._sort_input_box').hide();
tr.find('._edit_box').show();
tr.find('._update_box').hide();
}
window.flagReq = false;
});
});
});
//取消
$('._cancel').click(function(){
var tr = $(this).parents('tr');
tr.find('._sort_box').show();
tr.find('._sort_input_box').hide()
tr.find('._edit_box').show();
tr.find('._update_box').hide();
});