如何切換/摺疊的JavaScript元素（我要崩潰了默認的HTML）

您好我需要用我的代碼，使下面的HTML崩潰幫助，因爲它目前不垮如何切換/摺疊的JavaScript元素（我要崩潰了默認的HTML）

這是JavaScript函數代碼

function(event, ui) { 
    html=''; 
    var show = "Yes"; 
    html += "<h5 id='collapsible'>"+ show +"</h5>"; 
}; 

$('#history').html(html);

下面是HTML文本代碼顯示的是在HTML頁面上

<div id="history"></div>

請幫我切換/摺疊<div id="history"></div>

來源

2013-04-08 Spha C

您可以使用JavaScript方法如下：

function toggle() { 
    var target = document.getElementById("history"); 
    if(target.style.display == 'block'){ 
     target.style.display = 'none'; 
    } 
    else { 
     target.style.display = 'block'; 
    }

要默認摺疊HTML，設置屬性：

<div id="history" style="display:none;"></div>

來源

2013-04-08 12:29:53 Vishy

只要記住它不會隱藏它，如果它不是'block'（例如'inline-block'） – MMM 2013-04-08 12:47:07

jQuery的版本：

http://www.codepen.io/anon/pen/xBdkl

<div id="temp" onClick="javascript:func()">Show/Hide</div> 
<p/> 
<div id="history"></div> 
<script> 
var html=''; 
var show = "Yes"; 
html += "<h5 id='collapsible'>"+ show +"</h5>"; 
    $('#history').html(html); 

var func = function(){ 
    if($("#history").is(":visible")){ 
     $('#history').hide(); 
    }else{ 
    $('#history').show(); 
} 
} 
</script>

來源

2013-04-08 12:43:28 Sid

1.不要在'onclick'中使用'javascript：'，這是沒有理由的。 2.一個jQuery解決方案會使用'toggle（）'，否則你會重新發明輪子。 – MMM 2013-04-08 12:52:58

啊，好的，toggle（）是更好的解決方案。得到它了！儘管如此，我的工作仍然很糟糕。只是說。 – Sid 2013-04-08 13:04:47

如果您已經使用jQuery，你可以簡單地使用toggle()：

$("#history").toggle();

來源

2013-04-08 12:50:34 MMM

這是jQuery的完美解決方案。 – Sid 2013-04-08 13:24:14

的Javascript：

$('#collapseHistory').on('click', function(){ 
     $("#history").toggle(); 
});

HTML：

<div id="history" style="display: none;"></div> 
<div id="collapseHistory">Show/Hide</div>

這應該工作

來源

2013-04-08 13:00:14 fernandosavio

如何切換/摺疊的JavaScript元素（我要崩潰了默認的HTML）

回答

相關問題