本文主要是介绍文本框可编辑查看页面,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!
<!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>
这篇关于文本框可编辑查看页面的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!