上一个点亮WAPQQ图标的工具制作教程,估计大部分人都是一头雾水,说实话,我自己也不喜欢看别人代码!看起来乱乱的!
所以这次,我还是决定继续拿一些简单的例子给大家,那么这次我们就以QQ拼音的图标为例哦!
我们编辑 main.htm 文件, 在 Hi~ 工具猫 的下面加上如下的代码
- [color=#FF0000]-------------------------
- [ post]<input type="checkbox" onclick="this.checked ? 网络.获取('http://py.qq.com/cgi-bin/lighticon?iconstate=1&hash='+当前时间(),function(){弹出('点亮QQ拼音图标成功');}) : 网络.获取('http://py.qq.com/cgi-bin/lighticon?iconstate=0&hash='+当前时间(),function(){弹出('熄灭QQ拼音图标成功');}) "></input> <-- 点此点亮或熄灭拼音图标
- <br/><br/> 提示大家: QQ拼音积分等级到达4级的用户才可以点亮[/post]
- ------------------------[/color]
3. 这一次的代码,相比第一个教程,要长不少,原因是,我们同时具备了 点亮和熄灭2个功能!
其中
下面这句是点亮图标的命令
网络.获取('http://py.qq.com/cgi-bin/lighticon?iconstate=1&hash='+当前时间() ,function(){弹出('点亮QQ拼音图标成功');})
这句是熄灭图标的命令
网络.获取('http://py.qq.com/cgi-bin/lighticon?iconstate=0&hash='+当前时间() ,function(){弹出('熄灭QQ拼音图标成功');})
大家仔细观察上面2个命令,其实差别就在于 iconstate=1 和 iconstate=0 ,1表示点亮, 0 表示熄灭
其中: + 当前时间() 是为了防止浏览器缓存而造成的请求失效!
-----------------------------------------------
4. 这里用到了JS里的一个三目操作符,听起来很悬乎的,本质如下
某个条件 ? A : B
如果 某个条件 为真, 则执行 A , 否则 执行 B
我们代码里的 this.checked 表示 框子是否被勾上
this.checked ? A命令 : B命令
如果框子被勾上,则执行A命令, 如果没有被勾上,则执行B
这个就是一句代码,可以选择性执行不同操作的原理!
对代码有兴趣的,可以自己体会体会!
5. 最后就是看看工具的效果吧!
点击在新窗播放