遇到一个小需求,
即得到一个页面某一块的html源码, 这段html中包涵了一个表单, 且表单的值是被编辑过的,
直接用innerHTML(或jquery的html()方法)即可得到, 但各个浏览器表现不统一,表单的值有的原始值, 有的是最新值所以写了下面一个小方法来搞定
<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="utf-8" />
<title>复制html</title>
<meta name="author" content="sanshizi" />
<style>
*{font-size:14px;}
body{padding:20px;height:500px;}
</style>
<script type="text/javascript" src="jQuery.js"></script>
</head>
<body onclick="get()">
<div id="data">
<input type="text" name="t1" value="1" />
<input type="text" name="t2" value="2" />
<input type="text" name="t3" value="3" />
<select name="age">
<option value="1">1</option>
<option selected value="2">2</option>
<option value="3">3</option>
</select>
<input type="checkbox" name="ha" value="fff" />
<input type="checkbox" name="ha" value="zzz" />
<input type="checkbox" name="ha" value="ccc" />
<input type="checkbox" name="ha" value="xxx" />
<input type="radio" name="dd" value="1" />
<input type="radio" name="dd" value="2" />
<input type="radio" name="dd" value="3" />
<input type="radio" name="dd" value="4" />
<textarea cols="40" rows="3">asdfasfsf</textarea>
</div>
<script>
function get(){
//搞定 type=text, 同时如果checkbox,radio,select>option的值有变化, 也绑定一下, 这里忽略button
$("input,select option").each(function(){
$(this).attr('value',$(this).val());
});
//搞定 type=checkbox,type=radio 选中状态
$("input[type='checkbox'],input[type='radio']").each(function(){
if($(this).attr('checked'))
$(this).attr('checked',true);
else
$(this).removeAttr('checked');
});
//搞定select选中状态
$("select option").each(function(){
if($(this).attr('selected'))
$(this).attr('selected',true);
else
$(this).removeAttr('selected');
});
//搞定 textarea
$("textarea").each(function(){
$(this).html($(this).val());
});
alert($('#data').html())
}
</script>
</body>
</html>
分享到：
相关推荐
html，表单自动填充，避免重复性工作，一个一个填写，复制粘贴到文本域，自动识别对应表单属性，复制之后自动识别，点击提交就行了。超级简单，有什么不懂的可以直接私信问我。
jQuery复制移除表单元素代码基于jquery.1.7.2.min.js制作，可复制移除相同表单。
后台layui表单生成器代码复制即用，添加编辑一体，可条件判断 使用方式：放在服务器根目录访问域名+/tfForm/index.html使用本程序
最普通最常用最一般的方法就是用submit type..看代码： 复制代码代码如下: <form name=”form” method=”post” action=”#”> <input type=”submit” name=”submit...第三种是使用链接来提交表单，用到了
1 能批量从excel 文档中复制数据到html页面的格子里 2 支持各主流浏览器IE8+、firefox、chrome、360浏览器 3 内有简单使用示例
这个时候我们可以在表单中直接放置一个“新增一项”或“复制”按钮，通过点击按钮即可实现复制表单元素。 查看演示 下载源码 HTML 本文我们通过实例介绍一款简单的基于jQuery的元素复制插件，通过调用该插件轻松...
1 method是指定数据如何发送到服务器的一个属性 2 只...比如说有2个页面，a.htm和b.asp，你想将a.htm页面表单中的值传递给b.asp页面。 那么在a.htm中就会有如下的表单代码： 复制代码代码如下: <form id=”form1″
在input标签里设置type="submit"即可设置此表单控件为按钮。 submit按钮代码： 复制代码代码如下:<input name=”” type=”submit” value=”提交” /> submit按钮效果截图 html submit按钮效果截图 2、html...
在一些应用中，有时我们提交表单内容如（密码）重要信息时，为了安全，需要阻止一些复制剪切和粘贴事件，今天做了一个简单的例子有关阻止复制剪切和粘贴事件： 代码如下: <!DOCTYPE html> <html> <head&...
HTML5对表单元素提供了patern属性，它接受一个正则表达式...XML/HTML Code复制内容到剪贴板 <!DOCTYPE html> <form> <input id=text pattern=^1[3-9]\d{9}$ required /> <input id=b
以惊人的设计创造出最好的形式如何安装和启动项目git clone纱纱线起头如何使用要添加元素，请单击“添加元素”按钮，然后选择所需的元素。...您可以在代码框架中的html和css之间切换代码，以复制并嵌入到您的网站中。
轻松创建自定义HTML表单，并在完成后将代码复制到您的项目中。 在对许多HTML表单进行编码之后，表单生成器的想法似乎是必要的。 Formease将大大减少编写HTML表单代码所需的时间。 试试看。 该项目是新项目，功能...
获取 HTML 表单 (HTML Form) 文本输入框 (input type=”text”) 数据 下面是一个 HTML 文件，这个 HTML 含有一个 HTML 表单 (HTML Form)，主要用来让用户输入用户姓名的。 复制代码 代码如下: <html> <...
HTML Code复制内容到剪贴板 <!DOCTYPE HTML> <html lang=en-US> <head> <meta charset=utf-8> <title>无刷新提交表单</title> <style type=text/css>...
PHP过滤提交表单的html代码里可能有被利用引入外部危险内容的代码。例如，有些时候用户提交表单中含有html内容，但这可能造成显示页面布局混乱，需要过滤掉。 方法一： 复制代码 代码如下: //get post data ...
信用卡表单验证插件Creditly是一款直观的信用卡表单验证插件，复制HTML，CSS和JavaScript在几秒钟内得到一个直观的信用卡表格。
QT打印pdf大多通过html形式来实现的,但我们需要打印界面控件,或者html实现不了，嫌麻烦的。可以使用QPdfWriter.通过QPdfWriter来获取QPainter对象,能实现在PDF上进行编辑画画操作，一个大家都能看懂的例子，可以看看
表单是做网页中很常使用到的元素，但预设的样式都是丑丑的，笔者今天要教各位快速...XML/HTML Code复制内容到剪贴板 <body> 性别(单选) <input type=radio id=male name=sex> 男性
可以使用以下几种： a1b2c3d4e5f6 a1:b2:c3:d4:e5:f6 a1-b2-c3-d4-e5-f6 a1-b2-c3-d4:e5:f6 支持复制，如果是非16进制会提示错误