您的位置:首页 > Web前端 > JQuery

jquery之hasClass

2014-01-04 17:01 288 查看
看jquery的在线手册,hasClass的例子给的是这个

html部分:

<div class="protected"></div><div></div>


jquery部分:

$("div").click(function(){
if ( $(this).hasClass("protected") )
$(this)
.animate({ left: -10 })
.animate({ left: 10 })
.animate({ left: -10 })
.animate({ left: 10 })
.animate({ left: 0 });
});


照抄过来跑了下,怎么点都没有效果。

两个问题:

一、没给div设置样式

二、div没有left属性

最后代码:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>hasClass</title>
<script type="text/javascript" src="jquery/jquery-1.10.2.min.js"></script>
</head>

<body>
<div style="width:100px; height:100px; border:solid 1px #000;"></div>
<div class="protected" style="height:100px; border:solid 1px #000; position:relative;left:100px;"></div>
<div style="width:100px; height:100px; border:solid 1px #000;"></div>
<script type="text/javascript">
$("div").click(function(){
if ( $(this).hasClass("protected") ){
$(this)
.animate({ left: -100 })
.animate({ left: 100 })
.animate({ left: -100 })
.animate({ left: 100 })
.animate({ left: 0 });}
});
</script>
</body>
</html>


然后阿姆斯特朗回旋加速喷气式阿姆斯特朗炮就成型啦

悲催,感觉这失误真低级......

PS:

不设置left也行,给个position,不论absolute、relative都行
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: