ボタンでの表示と非表示の方法は動作しません

2つのボタンを作成しました。目的は、段落を非表示にすることです。しかし、それは動作しません、私はかなり混乱している現時点では。ボタンでの表示と非表示の方法は動作しません

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

'' $（ドキュメント）.ready（関数（） ''べきでしょ '' $（ドキュメント）.ready（関数（.Tryあなたのコードで{}が欠落しています）{'' {'{' {''が見つからなかったことに気をつけてください） –

コンソールをチェックするのは良いことですが、何か間違った構文があればエラーが表示されます –

私は私のコードで{私はこのコードをここにコピーしましたが、このソリューションは私のためには機能しません... – Waltswen

あなたは以下のコード

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

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

});

出典

2016-12-23 14:19:05 geekbro

はあなたのブラケットを参照してください、彼らは誤ってコード化されています！あなたは、以下の構文を使用する必要があります：jQuery 3.0のよう

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

を他の構文はまだ機能するが、廃止予定であるとして、のみ上記の構文は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のjQueryでon.click対クリックをより良く理解するためにTHISを参照してください。

出典

2016-12-23 13:21:14 Sarath

ありがとう、このソリューションはうまくいきます。 – Waltswen

なぜできないのですか？あなたは投票して私を奨励:) :) – Sarath

ボタンでの表示と非表示の方法は動作しません

答えて

関連する問題