单击按钮可隐藏或取消隐藏文本

Hide or unhide text with button click

本文关键字:隐藏 取消 文本 单击 按钮      更新时间:2023-09-26

我是html的新手,这是我们的第一次javascript入门作业;我很自然地吓坏了!下面是我所说的一个例子:

<div class="someclassname"> <a href="image.jpg">
           <img src= Image/image.jpg height="80">
    </a>
    <p>some text to he hidden with the image!</p>
</div>

我到处寻找,发现了类似的东西,但我太无能了,无法将其转化为我正在做的

我想代码应该是这样的吧?

<script>
$(document).ready(function() {
$("Button").click(function() {
$(".someclassname").toggle();
if ($.trim($(this).text()) == 'Hide') {
$(this).text('Show');
} else {
$(this).next('Hide');
}
});
</script>

我接近了吗?请帮忙!

你已经足够接近了。。。

脚本中出现语法错误,缺少一对}),然后在html 中放置一个按钮

$(document).ready(function() {
  $("button").click(function() {
    $(".someclassname").toggle();
    if ($.trim($(this).text()) == 'Hide') {
      $(this).text('Show');
    } else {
      $(this).next('Hide');
    }
  });
}); //this is missing
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<button>Hide</button>
<div class="someclassname">
  <a href="image.jpg">
    <img src="Image/image.jpg" height="80" />
  </a>
  <p>some text to he hidden with the image!</p>
</div>