如何使用顯示，隱藏和切換在酥料餅

我已經可以隱藏/顯示或切換元件，如這一個如何使用顯示，隱藏和切換在酥料餅

<h4 id="h4">Hide this when needed</h4> 
<button id="showInput" >Show Input</button> 
<button id="hideTheH4">Hide Text</button> 
<div id="input" style="display:none;"> 
<input type="text" placeholder="Enter Name"> 
</div>

而且腳本

$(document).ready(function(){ 
    $('#showInput').click(function(){ 
    $('#input').toggle(); 
    }) 
}); 
$(document).ready(function(){ 
    $('#hideTheH4').click(function(){ 
    $('#h4').toggle(); 
    }) 
});

我看到這一個http://jsfiddle.net/7ekRN/我試圖創建具有酥料餅和按鈕一個按鈕，可以使用腳本
這是代碼
HTML

<h4 id="h4">Hide this when needed</h4> 
<button data-toggle="popover" data-trigger="focus" id="option">Option</button> 

<div id="popOptions" style="display:none;"> 
      <a href='#' id="showInput">Show Input</a><br> 
      <a href='#' id="hideH4">Hide Text</a> 
</div> 
<div id="input" style="display:none;"> 
<input type="text" placeholder="Enter Name"> 
</div>

腳本

$(document).ready(function(){ 
    $('#option').popover({title: "Select", content: $("#popOptions").html(), html: true, placement: "right"}).click(function(){ 
    $(this).popover('show'); 
    }); 
}); 
$(document).ready(function(){ 
    $('#showInput').click(function(){ 
    $('#input').toggle(); 
    }) 
}); 
$(document).ready(function(){ 
    $('#hideH4').click(function(){ 
    $('#h4').toggle(); 
    }) 
});

但是當我點擊酥料餅的內容不切換H4和輸入
他們是否有不同？怎麼我不知道在哪裏，什麼是錯的

來源

2016-08-31 Trick

那麼你的問題是什麼？ –

當我點擊popover的內容時，它不會切換id = h4的div和id =輸入 – Trick

你的代碼沒有問題。唯一的問題是，你必須包括popover.js庫文件到你這樣的腳本

<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>

這裏是一個jsFiddle與你定的代碼。我只包括popover.js庫

來源

2016-08-31 13:03:05

Did not work。順便說一句，我用這個代碼 ' – Trick

如何使用顯示，隱藏和切換在酥料餅

回答

相關問題