在dojo中切換div的可見性

什麼是切換dojo中div的可見性的絕對最簡單的方法，沒有任何大驚小怪。在dojo中切換div的可見性

jQuery中我可以這樣做：

$(document).ready(function(){ 
    $("#mydiv").hide();   
    $("#link-that-toggles-div").click(function()  
    {   
    $("#mydiv").slideToggle();   
    }); 
} 

... 

<a href="#" target="_self" id="link-that-toggles-div">Toggle the div</a> 
<div id="mydiv">Awesome content</div>

是否有任何道場相當於東西嗎？或者我必須推出自己的？例如，dojo.fx.Toggler迫使我手動進行顯示/隱藏，而不是簡單地給我一個toggle（）函數。此外，所有示例都使用一個按鈕來顯示div，另一個用於隱藏它，我不確定爲什麼它在這種情況下甚至稱爲Toggler。

來源

2013-08-06 Joakim

檢查這裏http://dojotoolkit.org/reference-guide/1.9/dojo/fx/Toggler.html –

正如我試圖提到的問題，我意識到Toggler類，但我覺得它缺乏和重現相當的jQuery代碼不完全是直截了當的。例如，我想要同一個按鈕在顯示和隱藏div之間切換。 Toggler類的所有示例都使用2個按鈕。我是否真的需要編寫自己的代碼來檢查div是否隱藏，並在那種情況下執行show（），反之亦然？爲什麼在這種情況下甚至稱爲Toggler？如果我必須自己實現所有的切換邏輯。 – Joakim

這是一個簡單的例子，您可以如何使用一個按鈕：toggleIn/toggleOut。

require(["dojo/fx/Toggler", "dojo/dom", "dojo/on", "dojo/domReady!"], 
function(Toggler, dom, on){ 
var isClicked = false; 
var toggler = new Toggler({ 
node: "basicNode" 
}); 
on(dom.byId("toggleButton"), "click", function(e){ 
    if(isClicked===false){ 
     toggler.hide(); 
     isClicked=true; 
    } 
    else{ 
     toggler.show(); 
     isClicked=false; 
    } 
}); 
});

通過變量「isClicked」，您可以更改要使用的切換點。

下面是上面的例子中，小提琴： http://jsfiddle.net/XLAFz/

問候，楊千嬅

來源

2013-08-06 08:36:55 MiBrock

感謝您的代碼示例。我希望我不必自己實現所有這些邏輯，並且有更像jQuery示例的東西。 – Joakim

好吧 - 這不是所有的功能，但它是一個很好的小而沒有任何特殊或複雜的曲折。我已經使用了一個Button，只需在變量的幫助下更改被調用的函數。我對jquery不太瞭解，但遺憾的是似乎沒有別的辦法來處理dojo的切換。 – MiBrock

require(["dojo/dom", "dojo/dom-class", "dojo/on", "dojo/domReady!"], 
    function(dom, domClass, on){ 
     on(dom.byId("ID"), "click", function(){ 
      domClass.contains("ID", "hide")? domClass.replace("ID", "display", "hide"):   
              domClass.replace("ID", "hide", "display"); 
    }); 
}); 

/* .hide{display:none} .display{display: block} */

來源

2013-08-06 12:12:00 user2653056

domClass有一個'toggle'功能。 – mbomb007

在dojo中切換div的可見性

回答

相關問題