显示和隐藏方法不会在按钮上工作

我创建了两个按钮，其目的是显示或隐藏段落。但它不会工作，我现在很困惑。显示和隐藏方法不会在按钮上工作

HTML代码：

<!DOCTYPE html> 
    <html lang="sv-se"> 
    <head> 
     <meta charset="UTF-8"> 
     <title>My Web Page</title> 
     <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> 
    <script src="show.js"></script> 
</head> 
<html> 
    <body> 
    <p class="para">Click on button to show or hide text</p> 

    <button id="hide">Hide</button> 
    <button id="show">Show</button> 
</body>

这里是我的javascript代码：

$(document).ready(function() 
    $("#hide").click(function(){ 
    $(".para").hide(); 
}); 
$("#show").click(function(){ 
    $(".para").show(); 
    }); 
)};

来源

2016-12-23 Waltswen

''$（文件）。就绪（函数（）''也许应该是''$（文件）。就绪（函数缺少{}（）{''（注意丢失''''''''' –

）检查控制台总是很好的，如果有任何错误的语法，你会看到错误信息 –

我明白了，但是我没有忘记{在我的代码中只是当我复制代码在这里。这种解决方案不适合我... – Waltswen

你在你的代码。尝试下面的代码

$(document).ready(function(){ 
    $("#hide").click(function(){ 
    $(".para").hide(); 
    }); 

$("#show").click(function(){ 
$(".para").show(); 
    }); 

});

来源

2016-12-23 14:19:05 geekbro

见你的括号，他们被错误编码！你应该使用下面的语法：

$(function() { ... });

截至jQuery 3.0，只是建议而不是ready上述语法的其它语法仍然工作，但已被弃用。这是因为选择与.ready()方法的行为没有关系，这是低效的并且可能导致对方法行为的错误假设。

$(function(){ 
 

 
    $("#hide").click(function(){ 
 
    $(".para").hide(); 
 
    }); 
 
    
 
    $("#show").click(function(){ 
 
    $(".para").show(); 
 
    }); 
 

 
    
 
}); // <------ This brace was wrongly coded in your code!

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<p class="para">Click on button to show or hide text</p> 
 

 
    <button id="hide">Hide</button> 
 
    <button id="show">Show</button>

希望这有助于！

来源

2016-12-23 13:20:30

。在你的脚本缺少括号，试试这个..

$(document).on('click', '#hide', function(){ 
 
     $(".para").hide(); 
 
}); 
 
$(document).on('click', '#show', function(){ 
 
     $(".para").show(); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<!DOCTYPE html> 
 
    <html lang="sv-se"> 
 
    <head> 
 
     <meta charset="UTF-8"> 
 
     <title>My Web Page</title> 
 
</head> 
 
<html> 
 
    <body> 
 
    <p class="para">Click on button to show or hide text</p> 
 
    <button id="hide">Hide</button> 
 
    <button id="show">Show</button> 
 
</body>

ALSE参考THIS更好地了解点击VS jQuery中on.click的。

来源

2016-12-23 13:21:14 Sarath

谢谢，这个解决方案的工作原理。我只是想知道这样写代码的好处是什么？ – Waltswen

为什么不能你鼓励我通过投票:) .. – Sarath

显示和隐藏方法不会在按钮上工作

回答

相关问题