<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>文本框可编辑查看页面</title>
<script type="text/javascript" src="js/jquery-1.7.2.min.js" ></script>
<style>
.form_ul li{margin-top: 5px; font-size: 14px;line-height: 30px;list-style-type:none;}
.form_ul input[disabled]{background: none; border:0;}
.Default_btn{padding:0 10px;height: 30px; min-width: 50px; line-height: 30px; text-align: center; background-color:#006AB6; font-size: 16px; display: inline-block; color: #fff; cursor: pointer; border:0;}
.Default_btn.close{background-color: #EEF7FE; color: #333; border:1px solid #CFE8FF;}
.btn_subimt .Default_btn{margin-right: 20px;}
</style>
<script type="text/javascript">
$(document).ready(function(){
$('.edit_btn').click(function(){
$(".form_ul input").attr("disabled",false);
})
$('.submit_btn').click(function(){
$(".form_ul input").attr("disabled",true);
})
})
</script>
</head>
<body>
<ul class="form_ul">
<li>
<span>姓名：</span>
<input type="text" value="张三" name="name" disabled="disabled"/>
</li>
<li>
<span>电话：</span>
<input type="text" value="18192517955" name="phone" disabled="disabled"/>
</li>
<li>
<span>地址：</span>
<input type="text" value="人民路" name="phone" disabled="disabled"/>
</li>
</ul>
<div class="btn_subimt">
<input class="Default_btn close submit_btn" value="提交" type="submit">
<input class="Default_btn edit_btn" value="修改" type="submit">
</div>
</body>
</html>
扫一扫
评论
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
查看更多评论
添加红包
