jquery不断弹出的弹框

    jquery是js的一个库,可以利用极少的代码实现功能。以下是我在w3c上面略微修改的代码。实现的功能就是,制造一个对话框,每点击一次就会触发新的事件,可以根据自己需要进行编辑。以下代码可以用文本文档进行保存,将后缀改成html,发到手机上利用浏览器打开就可以看到动画效果了。
<!DOCTYPE html>
<html>
<body>
<div style="background-color:lavender;width:900px;height:500px;margin:20px;
padding-top:20px;color:#ffffff;font-weight:bold;font-size:50px;
float:left;text-align:center;
" οnclick="clickMeEvent(this)">吃了嘛Click Me</div>
<script type="application/javascript">
	<!--
	function clickMeEvent(obj)
	{
	if (obj.innerHTML=="那再见Goodbye")
		{
		obj.style.display="none";
		}
	else if (obj.innerHTML=="没吃啊Thank You")
		{
		obj.innerHTML="那再见Goodbye";		
		}
	else if (obj.innerHTML=="吃了嘛Click Me<br>吃的什么Click Me Again<br>好吃嘛And Again")
		{
		obj.innerHTML="没吃啊Thank You";		
		}
	else if (obj.innerHTML=="吃了嘛Click Me<br>吃的什么Click Me Again")
		{
		obj.innerHTML=obj.innerHTML+"<br>好吃嘛And Again";		
		}
	else
		{
		obj.innerHTML=obj.innerHTML+"<br>吃的什么Click Me Again";
		}
	}
	//-->
</script>
</body>
</html>

代码思路
就是对内容进行判断,然后再输出的过程。之前我们在手机上有一种我们一旦点击进去就要点好多下才可以出来的情况。利用jquery可以做出差不多的效果。如果只想每次框里面的文字只有一个的话,进行简单的修改就可以。

  function clickMeEvent(obj)
    {
    if (obj.innerHTML=="那再见")
        {
        obj.style.display="none";
        }
    else if (obj.innerHTML=="没吃啊")
        {
        obj.innerHTML="那再见";        
        }
    else if (obj.innerHTML=="<br>好吃嘛")
        {
        obj.innerHTML="没吃啊";        
        }
    else if (obj.innerHTML=="<br>吃的什么")
        {
        obj.innerHTML="<br>好吃嘛";        
        }
    else
        {
        obj.innerHTML="<br>吃的什么";
        }
    }
    //-->
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值