通过JavaScript+Cookies实现保存表单内容并自动填充

在使用Typecho的时候,为了防止过多垃圾评论充斥整个博客,我们一般会强制要求游客在发表评论时填写自己的昵称与邮箱并提交给后台进行验证。这样(大概)可以减少SPAM在评论里出现的频率,不过同时也带来了一个问题:游客每次发表评论时都需要重新填写相关信息。

在不考虑浏览器的自动填充表单的情况下,要解决这个问题,一般有两个解决办法:换用三方评论插件通过OAuth登录来验证访客的真实性  或  取消邮箱验证并开启验证码来阻挡广告机器人的自动发布

这里我要介绍一种通过保存表单内容的方式来以不更改验证方法的情况下解决这个问题的方案。

基本思路:

通过插入一个全局JS脚本,在用户输入完表单内容后,通过一个checkbox对象的onclick事件,调用脚本中的checkBoxOnClick函数,检查checkbox.checked的值来判断用户是否需要保存相关信息。若是,则调用cookies写入函数,将表单的指写入当前浏览器cookies留作以后使用;若否,则清空cookies记录。

在每次页面载入时,检查Cookies开关项的布尔值,若开关项返回true,则将所有预先设置好的表格内容填充至相关对象;若开关项返回false,则不做任何处理。

全局JS脚本源码:

表单页面调用方法:

示例:

Demo

 

顺便,我本来是打算给Wordpress用的,结果写完一看源码,他们已经做了和我类似的实现了(而且还附带了游客GUID,这点也是我这个方法中存在不足的地方)。

发表评论

电子邮件地址不会被公开。 必填项已用*标注