我有几个<div>
我希望使用JQuery进行动画制作。我需要显示第一个<div>
,持续7秒。然后向下滑动并显示下一个<div>
,持续7秒。
以下是计算我<div>
的HTML代码:
<?php
header('Content-Type: text/html; charset=UTF-8');
?>
<div id='F1' class='Nouvelles' style='background- image:url(../ImagesAnnonces/google_chrome.png); background-size:contain;'>
<h2>test</h2>
<p>test</p>
</div>
<div id='E2' class='Nouvelles' style='background-image:url(../ImagesAnnonces/images.jpeg); background-size:contain;'>
<h2>test</h2>
<p>test</p>
</div>
<div id='F3' class='Nouvelles' style='background-image:url(../ImagesAnnonces/); background-size:contain;'>
<h2>test 2 FR</h2>
<p></p>
</div>
为此,我尝试了以下代码:
$(document).ready
(function(){
$.ajax(
{
url:"handlingPub.php",
type:"GET",
dataType:"text",
contentType:"application/x-www-form-urlencoded;charset=UTF-8",
success:function(code_html, status)//code_html contains all the `<div>`
{
$("#divPub").append(code_html);
$(".Nouvelles").css(
{
height:"90px",
display:"none",
padding:"0px",
margin:"10px",
overflow:"hidden",
border:"solid white 2px"
});
$('.Nouvelles[id^="F"]:lt(1)').css("display", "block");
$(".Nouvelles h2").css({padding:"0px", margin:"0px"});
}
});
function()
{
$('.Nouvelles[id^="F"]').each(function()
{
$(this).slideUp().delay(7000);
if($(this).next() != null)
{
$(this).next().slideDown();
}
});
}
});
现在问题是:
第一个<div>
正确显示。
但是我无法进入$('.Nouvelles[id^="F"]').each(function(){//I cant get here});
而且我不知道为什么。可能有一点我犯了错误?
OH!顺便说一下,我只需<div>
id
'F'
开头{{1}}
所以只有F1和F3不是E2。
非常感谢!
答案 0 :(得分:1)
$('.Nouvelles[id^="F"]').each
调用是在函数内部进行的,您似乎没有调用它。在这种情况下,您需要执行您想要执行的操作,而不是创建执行此操作的功能。摆脱function() {
电话周围的}
和each
,看看是否有帮助。