[英]Slide Toggle [Jquery Function] Not Working
我使用此代码来运行滑动切换,但当我单击它时它不会打开:
JS代码:
<script type="text/javascript">
$(document).ready(function () {
alert('hi i came to toggle');
$(".flip").click(function () {
$(this).next().slideToggle("fast");
});
});
function ViewGetSubjects(data) {
var subjects = (typeof data) == 'string' ? eval('(' + data + ')') : data;
$('#subjects').empty();
for (var i = 0; i < subjects.length; i++)
{
$('#subjects').append('<h1 class = "flip">'+subjects[i].Wkp_lesson+'</h1><div class="panel" >' + ' Weekly Body: ' + subjects[i].Wkp_Body + ' Weekly Body: ' + subjects[i].Wkp_Body + ' Weekly Lesson: ' + subjects[i].Wkp_lesson + '</div>');
}
}
CSS:
div.panel,h1.flip
{
margin:0px;
padding:5px;
text-align:center;
background:#488AC7;
border:solid 1px #F6358A;
}
div.panel
{
height:120px;
display:none;
}
你知道为什么吗?
非常感谢:)
如果您使用的不是最新版本的 jquery
$(".flip").live('click', function(e){
$(this).next().slideToggle("fast");
});
否则应该是
$("#subjects").on('click', 'h1.flip', function(e){
$(this).next().slideToggle("fast");
});
因为您在#subjects
(具有 id=subjects 的元素)元素内动态附加DOM
( h1
with class name flip
)元素。
参考资料: on and live (deprecated) 。
除了我的评论,您是否可能忘记包含 jquery 库?
<script src="http://code.jquery.com/jquery-latest.js"></script>
这将包括直接来自 jquery.com 的最新版本,但建议您复制代码并将其保存在您自己的文件中。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.