首页 > 代码库 > 用chrome浏览器实现手动“自动填充表单”

用chrome浏览器实现手动“自动填充表单”

现在的浏览器基本都有自动填充表单的功能,可以极大的节约我们填写一些常见表单,尤其是登录表单的填写时间。

但是现在随着用户需求的不断发展,很多网页都是使用js来实时进行表单提交的操作,这些操作可能根本不涉及实际的submit操作,所以不会被浏览器截获并记录,这个时候面对一些需要反复重复填写的常见的表格就很郁闷了。

不过还好,这种情况依然是可以实现手动“自动填充表单”的,方法就是利用chrome浏览器的console功能。方法是在要填写表单的页面上按F12,点击console。


经试验,至少有以下两种方式可以完成表单的自动填写:

假设,有5个输入框需要填写,分别是名称、地址、端口、用户名、密码。


方法1:

假设这些输入框都有ID,那么在console里粘贴如下代码回车即可:

void((function(){
document.getElementById("name").value = http://www.mamicode.com/"localpc";>
value的值根据实际情况修改即可。


方法2:

假设这些输入框只有name而没有id,下面的方法一样可以自动填写表单(一样是粘贴到console里回车即可):

$('[name=name]').val('localpc');
$('[name=host]').val('127.0.0.1');
$('[name=port]').val('22');
$('[name=username]').val('root');
$('[name=password]').val('root');

经过实际试验,虽然不如浏览器的自动完成好,但效率还是提高了不少。更重要的是,这样的方法去填写常见表单,不会出现自己偶尔不小心输入错了的情况,还是很实用的。