根据点击按钮隐藏和显示div（jquery）

如何根据点击按钮来隐藏和显示内容？我尝试做，但它不起作用，我不知道什么是错的。你可以帮我吗？根据点击按钮隐藏和显示div（jquery）

<script src="Scripts/jquery-1.4.1.js" type="text/javascript"></script> 


<div id="list" > 

    <input id="button" type="button" value="Show Status" onclick="ShowHide()" /> 
</div> 


<div id="content2" style="display:none" > 
    <img src="http://kobylnica.pl/pic/item,69,1,x.jpg" alt="Tekst alternatywny" /> 
    Miejsce na wyświetlenie filmiku i opisu trasy 
</div> 

<script type="text/javascript"> 
    function ShowHide(){ 
      if ($("#content2").css('display') == 'none'){ 
      $("#content2").show(); 
      $("#button").val("Hide"); 
     } 
     else{ 
      $("#content2").hide(); 
      $("#button").val("Show Status"); 
     } 
    } 
</script>

来源

2014-05-02 Koin Arab

你的代码的工作：http://jsfiddle.net/ barmar/dTN9h/1/ – Barmar

@Barmar - 让我为你的皮条客 - > ** http：//jsfiddle.net/dTN9h/3/** – adeneo

也许吧是时候更新你的jQuery了，你正在使用一个三年前的jQuery版本。 – adeneo

你可以简单地用代码：

<div id="list" > 
    <input id="button" type="button" value="Show Status" onclick="$('#content2').toggle(); ($(this).val() == 'Hide')?$(this).val('Show Status'):$(this).val('Hide')" /> 
</div>

来源

2014-05-02 21:07:23 ekans

按钮文字怎么样？内联jQuery总是让我不寒而栗！ – adeneo

这不会将按钮上的标签从“隐藏”更改为“显示”。 – Barmar

它现在改变文本 – ekans

试试这个代码：

<script src="Scripts/jquery-1.4.1.js" type="text/javascript"></script> 
<div id="list"> 
    <input id="button" type="button" value="Show Status" onclick="ShowHide()" /> 
</div> 
<div id="content2" style="display:none"> 
    <img src="http://kobylnica.pl/pic/item,69,1,x.jpg" alt="Tekst alternatywny" />Miejsce na wyświetlenie filmiku i opisu trasy</div> 
<script> 
function ShowHide(){ 
    $("#content2").toggle(); 
    $("#button").val(function(_,t) { return t == "Hide" ? 'Show Status' : "Hide"; }); 
} 
</script>

例子：http://jsfiddle.net/dTN9h/4/

来源

2014-05-02 21:12:59

根据点击按钮隐藏和显示div（jquery）

回答

相关问题