显示并在一个div

隐藏内容有4“更多” button.Clicking上的每个按钮显示了其在同一div内容。点击两次应隐藏内容。但点击一个按钮，然后点击下一个按钮应显示第二个按钮的数据。我该如何做？

我试过使用javascript，检查div内的内容是否为空按钮click.if空显示数据，如果没有document.getElementById（“display_message”）。innerHTML =“”;

通知消息：

<input type="button" class="btn btn-default" value="READ MORE" onclick="displayNotificationMessage();">

验证消息

<input type="button" class="btn btn-default" value="READ MORE" onclick="displayVerificationMessage();"> 

<div class="container" id="display_message" > 

      </div> 

<script> 
function displayNotificationMessage() 
{ 

var data="abcde"; 


    var msg=document.getElementById("display_message").innerHTML; 

    if(msg!="") 
    { 

    document.getElementById("display_message").innerHTML=""; 
    } 
    else 
    { 


    document.getElementById("display_message").innerHTML=data; 
    } 
} 


function displayVerificationMessage() 
{ 

var data="bbjkhkjhkjlk";   

    var msg=document.getElementById("display_message").innerHTML; 

     if(msg!="") 
    { 

    document.getElementById("display_message").innerHTML=""; 
    } 
    else 
    { 


    document.getElementById("display_message").innerHTML=data; 
    } 

} 
</script>

但点击一个按钮，然后点击下一步按钮不会显示内容。如何做到这一点？

来源

2016-03-03 Pho Enix

你能告诉我们你试过了什么吗？这不是让代码为你写代码的地方，但如果你出错了，我们可以帮助你。 – DevDonkey

您可以使用jQuery并使用预先填充的隐藏div内容填充div。 – KiwiJuicer

但点击每个按钮应显示不同的内容在同一个div。正确的。@奇异果榨汁机 –

说你有，所有文本div＃内容div。在这个div中，你放置了4个div，包含单独的文本，与class .sub-content和适当的数据属性相关联。

<div id="content"> 
<div class="sub-content" data-id="b1">Some text 1<div> 
<div class="sub-content" data-id="b2">Some text 2<div> 
<div class="sub-content" data-id="b3">Some text 3<div> 
<div class="sub-content" data-id="b4">Some text 4<div> 
</div>

和

<button id="b1">Button1<button> 
<button id="b2">Button1<button> 
<button id="b3">Button1<button> 
<button id="b4">Button1<button>

然后，它是一样简单。

$('button').click(function() { 
    if ($('.sub-content[data-id=' + $(this).attr("id") + ']').css("display") == "hidden") { 
    $('.sub-content').hide(); 
    $('.sub-content[data-id=' + $(this).attr("id") + ']').show(); 
    } else { 
    $('.sub-content[data-id=' + $(this).attr("id") + ']').hide(); 
    } 
});

来源

2016-03-03 10:58:01 ziemowit

这里点击button1隐藏它的内容，button2隐藏button2的内容等等...... 但是我需要切换按钮上的div（显示和隐藏）button1点击应该显示其内容，再次按钮1 click应该隐藏内容。如果我第一次点击button1然后点击button2，div应该显示button2的内容。默认情况下，任何东西都不应该显示在div上。 - @ziemowit –

这就是为什么，第二行有一个if语句，同样在CSS中.sub-content {display：none;} – ziemowit

显示并在一个div

回答

相关问题