顯示和隱藏方法不會在按鈕上工作

我創建了兩個按鈕，其目的是顯示或隱藏段落。但它不會工作，我現在很困惑。顯示和隱藏方法不會在按鈕上工作

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

顯示和隱藏方法不會在按鈕上工作

回答

相關問題