在两组文本之间切换

我在网页上有两段文字，并且希望一次只能看到其中的一段文字。理想情况下，我想通过页面顶部的一组按钮来实现这一点，可能通过JavaScript或jQuery？在两组文本之间切换

编辑：我目前正在使用下面的代码。一切都可见，按钮是'可点击'的，但是当我点击按钮时没有任何反应。

<!DOCTYPE html> 
<html> 
<body> 

<h1>What OCA should do next</h1> 

<div id='Content'> 
<div id='1'><p>THIS IS TEXT 1</p></div> 
<div id='2' style='display:none;'><p>THIS IS DEFINITELY NOT TEXT 1</p></div> 
</div> 

<button type="submit" value="Submit">Submit</button> 
<script> 
var shown = 1; 
$("#Submit").click(function() { 
    if(shown == 1) { 
     $("#text1").css("display", "none"); 
     $("#text2").css("display", "block"); 
     shown = 2; 
    } 
    else { 
     $("#text2").css("display", "none"); 
     $("#text1").css("display", "block"); 
     shown = 1; 
    } 
}); 
</script> 
</body> 
</html>

来源

2014-04-30 user3590219

有点多搜索会给你答案：http://stackoverflow.com/questions/14720054/jquery-toggling-between-two-different-divs-on-button-click – gurudeb

欢迎来到SO。请不要在评论中留下冗长的代码。 – isherwood

感谢您的协助。我只是在经过漫长的搜索之后发布的，其中我只找到了预制翻译切换的答案，这并不是我之前的做法。 – user3590219

您可以将它们放置在不同的div内容div中，并在不同的时间告诉他们：

<div id='Content'> 
    <div id='text1'><p>THIS IS TEXT 1 </p></div> 
    <div id='text2' style='display:none;'><p>THIS IS DEFINITELY NOT TEXT 1 </p></div> 
</div> 
<a id='changeText'>CHANGE</a> 
<!-- Style the <a> To make it look like a button --> 
<script> 
    var shown = 1; 
    $("#changeText").click(function() { 
     if(shown == 1) { 
      $("#text1").css("display", "none"); 
      $("#text2").css("display", "block"); 
      shown = 2; 
     } else { 
      $("#text2").css("display", "none"); 
      $("#text1").css("display", "block"); 
      shown = 1; 
     } 
    }); 
</script>

我希望这是对你有所帮助。

来源

2014-04-30 17:03:59

这看起来不错，我可以在代码中看到它应该做我需要做的事情。不幸的是，当我预览它时，该按钮似乎不起作用。 – user3590219

尝试使用我刚刚编辑的编辑 –

谢谢。我有一个去，但我仍然无法正常工作。请参阅上面的新编辑。我感谢您的帮助。 – user3590219

在两组文本之间切换

回答

相关问题