関数呼び出しの助けが必要

私は初心者がいて、フォローコードを実行するのに問題があります。私がリセットボタンを押すと、私が定義したdraw()機能は実行されていないように見えます。前のグリッドは消去されますが、新しいグリッドはその場所に作成されません。関数呼び出しの助けが必要

私は理由を理解できないようです。どんな助けでも大歓迎です。

<!DOCTYPE HTML> 
<html> 
    <head> 
     <title>Etch-A-Sketch</title> 
     <link rel="stylesheet" type="text/css" href="CSS/styles.css"/> 
     <script src = "http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> 
     <script src = "JS/jquerry.js"></script> 
     <meta charset="utf-8"/> 
    </head> 
    <body> 
     <h1>Etch-A-Sketch</h1> 
     <h3>Cameron Watson</h3> 
     <div id='container'></div> 
     <div class='divbut'>RESET</div> 
    </body> 
</html>

#container {  
    border: 1px solid black; 
    height: 720px; 
    width: 720px; 
    margin: auto; 
    position: absolute; 
    top: 0; 
    left: 0; 
    bottom: 0; 
    right: 0; 
} 
.grid { 
    height: 45px; 
    width: 45px; 
    float: left; 
} 
h1 { 
    text-align: center; 
} 
h3 { 
    text-align: center; 
} 
.divbut { 
    border: 1px solid black; 
    height: 45px; 
    width: 65px; 
    text-align: center; 
}

$(document).ready(function() { 
    draw(16); 

    $('.grid').hover(function(){ 
     $(this).css("background-color", "#00ffff"); 
    }); 

    $(".divbut").click(function(){ 
     $('div').remove('.grid'); 
     draw(16); 
    }); 
}); 

function draw(count){ 
    for (x = 0; x < count; x++) { 
     for (y = 0; y < count; y++) { 
      $('<div>').addClass('grid').appendTo('#container'); 
     } 
    } 
};

出典

2016-05-04 Cameron00

あなたはjQueryの一部に '' **書いているのはなぜ？ちょうど私たちのためのハイライトのために？ – hmd

第2に、 '$（ 'div'）の代わりに' $（ 'div.grid'）。remove（）; 'を使うべきです。そうしないと、すべてのdiv要素が削除されます。 – hmd

ええええええええええええええええええええええええええええええええええええええええええええええええええええええええ、これを修正しましたが、まだ関数をロードしていません。 – Cameron00

あなたはhoverイベントがバインドされた元.grid要素を取り除くために問題があります。新しい.grid要素を作成すると、イベントはバインドされなくなります。あなたはhoverは（それがmouseenterの組み合わせの使用標準のイベントですされていないため、この場合のmouseeenterイベントにフックする必要があります

$('#container').on('mouseenter', '.grid', function(){ 
    $(this).css("background-color", "#00ffff"); 
});

Working example

：この問題を解決するには、委任されたイベントハンドラを使用する必要がありますおよびmouseleave）。

も@hmdで述べたように、あなたが$('.grid')要素上で直接削除呼び出す必要があり、ことに注意してください：

$(".divbut").click(function() { 
    $('.grid').remove(); 
    draw(16); 
});

出典

2016-05-04 12:00:44

ありがとうございました。今は意図したとおりに働く。 – Cameron00

問題ありません、喜んで助けてください –

関数呼び出しの助けが必要

答えて

関連する問題