javascript - 如何通过复选框隐藏/显示显示具有不同标题的相同 div

Question

我想通过复选框隐藏/显示来显示具有不同标题的相同 div。

$('#cbxShowHide').click(function() {
  this.checked ? $('#block').show(1000) : $('#block').hide(1000);
});

#block {
  display: none;
  background: #eef;
  padding: 10px;
  text-align: center;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="checkbox" id="cbxShowHide" />
<label for="cbxShowHide">Show/Hide</label>
<input type="checkbox" id="cbxShowHide1" />
<label for="cbxShowHide1">Show/Hide1</label>
<input type="checkbox" id="cbxShowHide2" />
<label for="cbxShowHide2">Show/Hide2</label>
<div id="block">Some text here</div>

在上面的例子中，点击复选框“显示/隐藏”我能够显示文本“Some text here”。

我想为第 n 个复选框执行此操作，以便我可以第 n 次显示“此处的一些文本”，如“此处的一些文本 1”、“此处的一些文本 2”

Answer 1

引用this jsfiddle .我已经将内容移动到 span 中的 div 中

$('#cbxShowHide1').click(function(){
    $('#block span').text("yyour new text for this div")
    this.checked?$('#block').show(1000):$('#block').hide(1000);
});

希望对你有帮助