主页 / 网络编程 /

javascript实现自动填写表单实例简析

网络编程 2021-07-04 21:04www.168986.cn编程入门
这篇文章主要介绍了javascript实现自动填写表单的方法,以一个简单实例形式分析了JavaScript结合浏览器设置实现自动保存表单的相关技巧,需要的朋友可以参考下

本文实例讲述了javascript实现自动填写表单的方法。分享给大家供大家参考，具体如下

在平时开发过程中，或者在访问某些站点，经常要频繁地填写一大堆表单时，我们可以利用javascript，写一段脚本，预先把要填的信息准备好，然后模拟点击按钮的动作，自动提交表单，轻松且高效。

步骤

1. 找到页面中对应的form，把form中所需的html控件列出来，如

<form name="customersForm" id="myform" method="POST" action="insert.php">
  <b> 姓 : </b> <input type="text" name="thisFnameField" size="20" value="">
  <b> 名 : </b> <input type="text" name="thisLnameField" size="20" value="">
  <b> 公司 : </b> <input type="text" name="thisCompanyField" size="20" value=""> 
  <b> 地址 : </b> <input type="text" name="thisAddressField" size="20" value="">
</form>

2.编写js代码

代码如下:
javascript:customersForm.thisFnameField.value = "张";customersForm.thisLnameField.value = "三";customersForm.thisCompanyField.value = "公司";customersForm.thisAddressField.value = "中国";customersForm.submit.focus();

3.第三步最重要，因为前2步稍微有点js知识的人都会写这么简单的代码。接下来就是利用浏览器的收藏夹（书签）功能寄存js代码。

以chrome为例，在书签上点击右键————> 添加网页，名称填【自动填表】，网址填【上面那段js代码】，然后保存即可。

4.测试一下。

在浏览器中打开对应的页面，然后点击书签栏中的【自动填表】,你就会惊奇的发现表格已经填好了。

希望本文所述对大家JavaScript程序设计有所帮助。

上一篇：jqGrid中文文档之选项设置 下一篇：Jquery插件之Fancybox丰富的弹出层效果附源码下载

编程语言

Copyright © 2016-2025 www.168986.cn 狼蚁网络 版权所有 Power by