专栏首页张戈的专栏博客文章重新启用评论,附一键填写评论中用户信息代码生成工具

博客文章重新启用评论,附一键填写评论中用户信息代码生成工具

博客关闭评论近一个月的时间,总体的感觉很是安逸,不过看了留言板的反馈,感觉关闭评论对一些真正需要帮助的朋友还是带来了些许不方便,思前考后,决定再次开放评论。

但是在百度云加速中,我依然开启了 html 的加速,所以每次打开文章页面,评论中的用户信息都会清空!所以,不是很相关、很重要的评论,我建议还是去留言板比较省时省力。

好了,下面是我从【倡萌的自留地】转过来的自动填写评论用户信息的代码生成工具

使用很简单:

①、正确填写昵称、邮箱、站点信息后,点击【生成代码】:

Ps:此时,你可以尝试点击【快速填写本文的评论信息】,看下本文评论框是否已正常填写你刚刚输入的信息。

使用 Ctrl +C 复制生成的代码,以备后用:

javascript:document.getElementById('author').value = '张戈博客'; document.getElementById('email').value = 'ge@zhangge.net'; document.getElementById('url').value = 'http://zhangge.net';void(0)

②、保存到收藏夹

I、如果是 360 等第三方浏览器,可直接拖拽【快速填写本文的评论信息】到浏览器收藏夹即可;

II、也可以右键【快速填写本文的评论信息】,选择添加到收藏夹,然后使用 Ctrl +V 粘贴前面复制的代码到网址即可

III:直接使用 Ctrl+D,先随便收藏一个网页,然后右键这个收藏,将链接内容修改成本文生成的 js 代码即可。

③、下次评论再遇到要填写用户信息,只需点击浏览器收藏夹中的链接,就能自动填充评论中的用户信息了!

如果你也想弄一个这样的工具,只需要将以下代码粘贴到博客相应页面即可(需文本模式):

<script type="text/javascript">
(function($){
	$(document).ready(function() {
		$('.code_result').hide();
		$('#generate_code').click(function(){
			var re = /^[0-9a-zA-Z]+([\.\-\_][0-9a-zA-Z]+)*@[0-9a-zA-Z]+([\.\-][0-9a-zA-Z]+)*.[a-zA-Z]+$/;
			if($('#commenter_author').val() == '') {
				$('#commenter_author').css('border', 'solid 1px #ff0000');
				$('#commenter_author').focus();
			} else if(!re.test($('#commenter_email').val())) {
				$('#commenter_email').css('border', 'solid 1px #ff0000');
				$('#commenter_email').focus();
			} else {
				var commenter_code = 'javascript:document.getElementById(\'author\').value = \''+$('#commenter_author').val()+'\'; document.getElementById(\'email\').value = \''+$('#commenter_email').val()+'\'; document.getElementById(\'url\').value = \''+$('#commenter_url').val()+'\'; void(0)';
				$('#wp_commenter_code').html(commenter_code);
				$('.code_result>a').attr('href', commenter_code);
				$('.code_result').show();
			}
		});
		$('#cheon_code_generator input').keyup(function() {
			$(this).css('border', 'solid 1px #000000');
		});
	});
})(jQuery);
</script>
<div id="cheon_code_generator" style="padding:10px;">
<p>昵称(必须):<br />
<input type="text" value="" name="commenter_author" id="commenter_author" style="border:solid 1px #000;"></p>
<p>邮箱地址(必须):<br />
<input type="text" value="" name="commenter_email" id="commenter_email" style="border:solid 1px #000;"></p>
<p>站点:<br />
<input type="text" value="" name="commenter_url" id="commenter_url" style="border:solid 1px #000;"></p>
<p><textarea cols="40" rows="10" name="wp_commenter_code" id="wp_commenter_code" style="border:solid 1px #000;"></textarea></p>
<p><input type="button" value="生成代码" id="generate_code" style="cursor: pointer;border:solid 1px #000;"></p>
<p class="code_result" style="display:none;">拖拽下面的链接到您的书签工具栏或者右键单击链接把它添加到您的收藏夹中可创建一个快速填写WP评论者信息的快捷方式。<br /><a href="#">快速填写WP评论信息</a></p>
</div>

经过几番折腾,我已将此功能集成到博客的评论框上面:

对于未作 CDN 缓存的页面(即可记住用户信息),只会在首次评论的时候出现懒人代码按钮,若已记住信息,将会隐藏这个按钮,点击【更改】个人信息,懒人按钮才会出现,存在 CDN 的页面,此按钮将一直存在:

可惜还是没能实现点击自动弹出收藏界面的功能,有大虾知道如何让常规的点击收藏功能兼容非网址么?不是网址,貌似就无法弹出收藏提示,懂的请赐教,万分感谢!!

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • Linux:mv 命令的10个实用例子

    当你想要将文件从一个位置移动到另一个地方并且不想复制它,那么 mv 命令是完成这个任务的首选。本文中总结了十个 Linux mv 命令的实例,希望能给大家带来一...

    张戈
  • 自动管理员身份执行小工具—asroot

    推荐使用的典型环境: 用户为普通帐号,没有管理员权限,但又必须取得程序安装权限,比如产线作业员需要时常更新驱动: 为了安全而使用普通帐号的个人电脑 还记得记得以...

    张戈
  • 解决网站404页面返回200状态码问题

    好久没打理博客,突然收到 CDN 流量预警,发现平均每天 40G 流量消耗!what?就现在这个访问量,不存在的。看了下 CDN 日志发现有小人一直在请求博客页...

    张戈
  • es6将txt数据序列化成json

    2、str=(txt里的数据),let arrStr = str.split('\n');

    杨肆月
  • (63) 实用序列化: JSON/XML/MessagePack / 计算机程序的思维逻辑

    上节,我们介绍了Java中的标准序列化机制,我们提到,它有一些重要的限制,最重要的是不能跨语言,实践中经常使用一些替代方案,比如XML/JSON/Message...

    swiftma
  • 使用 Vanilla JavaScript 框架创建一个简单的天气应用

    大家好,不知道大家听说过 Vanilla JavaScript 这款 框架吗?最近我在浏览国外的一些技术网站时,这个词出现的频率实在是在太高了,好多框架都宣称自...

    前端达人
  • 使用 Vanilla JavaScript 框架创建一个简单的天气应用

    大家好,不知道大家听说过 Vanilla JavaScript 这款框架吗?最近我在浏览国外的一些技术网站时,这个词出现的频率实在是太高了,好多框架都宣称自己是...

    前端达人
  • 数学题:查找,快速幂,二进制,剪绳子

    各位小伙伴,又到周末啦~本周小白已经开始二刷《剑指offer》了,这次在LeetCode上面刷题,发现LeetCode上面的《剑指offer》和牛客上面的题目好...

    鹏-程-万-里
  • Metallb - 贫苦 K8S 用户的负载均衡支持

    在私有网络上运行 Kubernetes,和御三家相比,对 LoadBalancer 类型的服务的支持应该是众多表面差异中最醒目的一个了。类型为 LoadBala...

    崔秀龙
  • Apache libcloud中对CloudStack的支持

    原文地址:https://dzone.com/articles/cloudstack-support-apache

    Steve Wang

扫码关注云+社区

领取腾讯云代金券