运用JQuery的toggle实现网页加载完成自动弹窗

2014-03-18 45

toggle()事件 它主要切换元素的可见状态。

1、toggle(switch) ①switch是一个可选值,如果不填则原来元素是显示则将其隐藏,如果是隐藏则显示。

HTML 代码:

<p>Hello</p><p style="display: none">Hello Again</p>

jQuery 代码:
$("p").toggle()

结果:
<p tyle="display: none">Hello</p><p style="display: block">Hello Again</p>

② switch如果有值则是TRUE或false,如果是TRUE则显示元素,FALSE隐藏元素。
HTML
<p id = "tt">Hello</p> 
<input type="button" value="变换" id="b">

JQuery
var i = 0; 
$("#b").click(function(){ 
$("#tt").toggle(i++%2==0); 
});

2、toggle(speed, [callback]) speed是可选参数它表示元素动画的速度,元素以动画的“滑动”的方式进行显示或隐藏,它的值可以使(slow、 normal 、fast); [callback]为函数可以执行的方法。

HTML代码

<p style="display: none" id = "t">Hello Again</p>

JQuery代码
$("#t").toggle("slow",function(){ 
alert("123456"); 
});

即:当用运用第二种方法时,隐藏speed则可以进行网页加载自动弹屏
展开阅读全文

更多Javascript文章

JQuery自定义事件的应用 JQuery最佳实践
Aug 01 38
Jquery知识点二 jquery下对数组的操作
Jan 15 44
jquery动态增加text元素以及删除文本内容实例代码
Jul 01 28
a标签click和href执行顺序探讨
Jun 23 46
深入理解JavaScript继承的多种方式和优缺点
May 12 37
基于Vue实现微信小程序的图文编辑器
Jul 25 53
微信小程序云开发如何实现数据库自动备份实现
Aug 16 40
手机访问当前页面