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

 更新时间:2015年12月02日 11:28:47   作者:Frank.Fan  
这篇文章主要介绍了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程序设计有所帮助。

相关文章

  • JavaScript中常见的七种继承及实现

    JavaScript中常见的七种继承及实现

    JS的继承方式在我们面试的时候经常会被问到,所以深入理解js继承方式以及它们的优缺点是非常有必要的。本文为大家整理了JavaScript中常见的七种继承及实现,需要的可以参考一下
    2023-03-03
  • javascript异常处理实现原理详解

    javascript异常处理实现原理详解

    这篇文章主要介绍了javascript异常处理实现原理详解,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
    2020-02-02
  • JavaScript获取页面上被选中文字的方法技巧

    JavaScript获取页面上被选中文字的方法技巧

    这篇文章主要介绍了JavaScript获取页面上被选中文字的方法技巧,本文直接给出实现代码和运行效果,需要的朋友可以参考下
    2015-03-03
  • js实现无刷新监听URL的变化示例代码详解

    js实现无刷新监听URL的变化示例代码详解

    这篇文章主要介绍了js如何无刷新监听URL的变化,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2020-06-06
  • 微信小程序 (地址选择1)--选取搜索地点并显示效果

    微信小程序 (地址选择1)--选取搜索地点并显示效果

    这篇文章主要介绍了微信小程序 (地址选择1)--选取搜索地点并显示效果,实现思路是通过拖动地图,搜索地址,选择地址并将地址值传给文本框,具体实例代码跟随小编一起看看吧
    2019-12-12
  • js正则表达式常用方法梳理(附代码案例)

    js正则表达式常用方法梳理(附代码案例)

    正则表达式在我们日程的工作项目中,应该是一个经常用到的技能,在做一些字符的匹配和处理的过程中,发挥了很大的作用,这篇文章主要给大家介绍了关于js正则表达式常用方法的相关资料,需要的朋友可以参考下
    2024-05-05
  • JS实现自动变换的菜单效果代码

    JS实现自动变换的菜单效果代码

    这篇文章主要介绍了JS实现自动变换的菜单效果代码,可实现自动变换菜单选中项的技巧,涉及JavaScript定时函数触发页面样式属性变换的技巧,具有一定参考借鉴价值,需要的朋友可以参考下
    2015-09-09
  • javascript中可能用得到的全部的排序算法

    javascript中可能用得到的全部的排序算法

    因此本篇重拾了出镜概率比较高的十来种排序算法, 逐一分析其排序思想, 并批注注意事项. 欢迎对算法提出改进和讨论
    2020-03-03
  • JavaScript实现写入文件到本地的方法【基于FileSaver.js插件】

    JavaScript实现写入文件到本地的方法【基于FileSaver.js插件】

    这篇文章主要介绍了JavaScript实现写入文件到本地的方法,结合实例形式分析了基于FileSaver.js插件实现保存文件到本地的相关操作技巧,并附带FileSaver.js插件完整源码,需要的朋友可以参考下
    2018-03-03
  • js简单设置与使用cookie的方法

    js简单设置与使用cookie的方法

    这篇文章主要介绍了js简单设置与使用cookie的方法,以简单实例形式分析了JavaScript设置与调用cookie的方法,需要的朋友可以参考下
    2016-01-01

最新评论