jquery向下滾動並按下按鈕

Question

我試着向下滾動按鈕。我寫了很多代碼，但都不起作用。 我用代碼解釋。

<div class="component"> 
    <div class="go_up"></div> 
    <div class="go_down"></div> 
    <div id="content1" class="componentin"> 
    <div id="item"></div> 
    </div> 
</div> 

這是我的HTML代碼。我想通過px滾動項目。此外，我在頁面中多次使用這個html代碼，所以代碼必須更具體。我試圖動畫第一個元素的按鈕div後，哪個類命名的項目。這是我的jQuery代碼（不行）

$(".go_up").click(function(){ 
    var this1 = $(this); 
    var content = $(this1 + '+ .componentin'); 
    var $component = $(content + ':first-child'); 
    $component.animate({"marginTop": "-=50px"}, "slow"); 
}); 
$(".go_down").bind('click',function(){ 
    var this1 = $(this); 
    var content = $(this1 + '+ .componentin'); 
    var $component = $(content + ':first-child'); 
    $component.animate({"marginTop": "+=50px"}, "slow"); 
}); 

感謝您的幫助

Answer 1

你選擇的表達不正確。代碼$('element1 + element2')只選擇直接兄弟姐妹。

//works 
$('element1 + element2') 
<element1 /> 
<element2 /> 

//but doesn't work here 
$('element1 + element2') 
<element1 /> 
<something /> 
<element2 /> 

而是使用兄弟選擇器。

http://jsfiddle.net/F7UqC/

$(".go_up").click(function(){ 
    $(this) 
     .siblings('.componentin') 
     .children('#item') 
     .animate({"marginTop": "-=50px"}, "slow"); 
}); 
$(".go_down").bind('click',function(){ 
    $(this) 
     .siblings('.componentin') 
     .children('#item') 
     .animate({"marginTop": "+=50px"}, "slow"); 
});