jquery中的嵌套選擇器

我需要調用嵌套div上的jquery.animate。 DIV的結構是這樣的jquery中的嵌套選擇器

<div id="jsPlumb_1_4" class="container"> 
     <div id="PlanItemPL1" class="PlanItem"> 
      <div id="window1" class="window"> 
      </div> 
     </div> 
</div>

我有興趣做的操作，如MouseDown事件，在div類窗口動畫的事件。有人可以讓我知道我應該寫什麼選擇器。謝謝您的幫助。

來源

2012-09-05 unix_user

你想要內部div或所有div上的動畫嗎？ –

關於內部div（div class =「window」是我感興趣的內容。） –

@KevinB：我沒有想到它。我認爲正常的寬度和高度是可行的。糾正我，如果我錯了。 –

我建議，沒有這一問題的進一步細節，一個通用的方法：

$('#jsPlumb_1_4').on('mousedown', function(e){ 
    $(this).find('div.window').animate({'width' : '100px'}, 1000); 
});

JS Fiddle demo。

在該演示中，我的mousedown事件綁定到#jsPlumb_1_4元素（事件將從任何其子元素的傳播），並觸發包含div.window元素的animate()。

爲了使它更有趣，我加入一個mouseup事件也使上mousedown的div.window縮小，並在mouseup它的增長：

$('#jsPlumb_1_4').on('mousedown mouseup', function(e){ 
    var newWidth = e.type == 'mousedown' ? '50%' : '80%'; 
    $(this).find('div.window').animate({'width' : newWidth}, 1000); 
});

JS Fiddle demo。

e.type檢索事件（mouseup或mousedown），並且newWidth變量或者是50%或80%取決於事件是否等於mousedown與否。

來源

2012-09-05 20:47:20

我不知道爲什麼它仍然不能在我的代碼中工作。是不同的div的差異可以導致問題？ –

對不起？你可以在[JS Fiddle]（http://jsfiddle.net/）上發佈你正在使用的代表性演示，以及你正在嘗試的內容嗎？然後我可以嘗試看看哪些功能無效。 –

你可以使用.mousedown（function（）{$（this）.find（'div.window'）。animate（{'width'：'100px'}，1000）;}）;以及 –

jquery中的嵌套選擇器

回答

相關問題