聊天室刷屏的简单原理实现

在聊天室中,如果我们想要实现刷屏的效果,其实很简单,因为这些我们都可以通过前台的js来完成。


首先,说一下原理,就是通过javascript来模拟文字的输入,来模拟提交按钮的点击。这里要实现这些,首先我们需要浏览器的debug,比如firefox的firebug,或者自带的调试工具也可,或者chrome的console台,ie+8的F12 开发者工具。


下面举个简单的例子:


首先审查元素,找到输入框的id比如:id="postText", 然后找到提交的id或者css,比如 class="btn_submit",

这里我们可以 将要输入的一大段话,可以很长很长复制到str上面,你也可以从其他网站找到源代码里的文字复制过来,然后我这里使用正则表达式去掉了html标签。

由于有的聊天室有文字的输入速度,所以我通过javascript的setInterval来设置一个延时时间来发信息,这样就可以实现自动刷屏了。

代码如下:


var i = 0;
var j = 100;
var str = "this is the test string will be show in input text.";
str = str.replace(/<[^>].*?>/g,"");

function output(i){
	var input = str.substr(i,10);
	jQuery("#postText").val(input);
	jQuery(".btn_submit").click(); 
}

var interval = setInterval(function(){
	output(i);
	i = i +10;
	if(i>1000){
		clearInterval(interval);
		console.log('ok');
	}
},6000);


这里就是希望我们要把自己学到的东西用到实际的应用中,这样就会对知识更加深入的理解,并能从中找到乐趣。


评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值