Question

我有一个扩展按钮，可以扩展文本并隐藏它。但它只适用于第一个div，所有其他链接到第一个按钮。这是JFiddle，理解我的意思：https://jsfiddle.net/y52t87qe/

HTML：

import java.util.Scanner;
public class Test {

private static Scanner scanner;

public static void main(String[] args) {
    // TODO Auto-generated method stub
    String answer;
    scanner = new Scanner(System.in); 

    System.out.println("Hello Human");
    System.out.println("Do you want to build a snowman?");
    answer = scanner.next();

    if (answer.equals("Yes"))
    System.out.println("Yay, Now you must think hard of what Olaf Looks like Okay? (say okay to coninue)");

    {
    else


        System.out.println("Go away! I hate you"); //This happens when I try to say Yes.. This is meant for no.

    }

   }

}

JQuery的：

<p class="info">Show to user</p>
<div class="hidden"><p class="info">Hide text, but show when the user clicks the button</p></div>

<button id="hide" onclick="btnChanger()">Expand</button>

是我的按钮是id，而不是类？我对JQuery很不熟悉，所以任何帮助都会很棒:)提前感谢！ X

Answer 1

DEMO

request(url, function (err, response,res1) {
                if (err) {
                    //error Handling;
                } else {
                    buffer = res1;
                    //Some Logic
                }
            });

将重复的ID更改为类

Answer 2

您的代码的第一个问题是，元素的ID必须是唯一的。

因此，使用类来处理类似

之类的元素

＆＃13;

jQuery(function($) {
  $('.hide').click(function() {
    var hidden = $(this).text() == 'Expand';
    $(this).siblings('.hidden').toggle(hidden);
    $(this).text(hidden ? 'Hide' : 'Expand')
  })
})

＆＃13;

.hidden {
  display: none;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="home-video-1">
  <h3>Introduction</h3>
  <h4 class="h4-home">Communication</h4>	
  <p class="info">Show to user</p>
  <div class="hidden">
    <p class="info">Hide text, but show when the user clicks the button</p>
  </div>
  <button class="hide">Expand</button>
</div>
<div id="home-video-2">
  <h3>Introduction</h3>
  <h4 class="h4-home">Communication</h4>	
  <p class="info">Show to user</p>
  <div class="hidden">
    <p class="info">Hide text, but show when the user clicks the button</p>
  </div>
  <button class="hide">Expand</button>
</div>
<div id="home-video-3">
  <h3>Introduction</h3>
  <h4 class="h4-home">Communication</h4>	
  <p class="info">Show to user</p>
  <div class="hidden">
    <p class="info">Hide text, but show when the user clicks the button</p>
  </div>
  <button class="hide">Expand</button>
</div>
<div id="home-video-4">
  <h3>Introduction</h3>
  <h4 class="h4-home">Communication</h4>	
  <p class="info">Show to user</p>
  <div class="hidden">
    <p class="info">Hide text, but show when the user clicks the button</p>
  </div>
  <button class="hide">Expand</button>
</div>

＆＃13;

Answer 3

尝试用class="hide"代替id="hide"，从onclick删除html，单.click()个事件，.prev(".hidden")选择器切换上一个{{1} }}，.hidden设置.html()，"Hide" "Expand"

html

＆＃13;

$(".hide").click(function(){
  $(this).html(this.innerHTML === "Expand" ? "Hide" : "Expand")
  .prev(".hidden").toggle();
});

＆＃13;

$(".hidden").hide();	
    $(".hide").click(function(){
        $(this).html(this.innerHTML === "Expand" ? "Hide" : "Expand").prev(".hidden").toggle();
    });

＆＃13;

按钮都链接到一个按钮？ jQuery的

3 个答案: