Question

好的，所以我遇到了一个问题，我根本就不明白如何修复。这个想法是：有1个痣图像，它具有onclick（）功能，可以去除被点击的痣，并产生另一个痣。与此同时，有一个计时器每秒产生一个痣。就像现在一样，它只是产生的第一颗鼹鼠，其他一切都是无用的，什么都不做。我已经在互联网上搜索了大约2天的任何答案，而且我没有提出任何答案。

发布

代码供参考。

$(document).ready( function() {

var pointcount = 0;
var time = 30;

$('#start_button').click(function() 
{

    $("#timer").text(time + " seconds left...");
    $("html").css('background-color', 'white');
    $("#howtoplay").text("");
    $("#start_button").attr("disabled",true);
    y = Math.floor(Math.random()*300);
    x = Math.floor(Math.random()*600);
    $('html').append('<img class="mole" src="img/mole.png" width='+200+' height='+177+' style="position:absolute; top:'+y+'px; left:'+x+'px;" />');



    $('.mole').click(function() 
        {
            pointcount++;
            $("#score").text(pointcount + " points");
            y = Math.floor(Math.random()*300);
            x = Math.floor(Math.random()*600);
            $('.mole').remove();
            $('html').append('<img class="mole" src="img/mole.png" width='+200+' height='+177+' style="position:absolute; top:'+y+'px; left:'+x+'px;" />');
        })




    setInterval(
    function timer(){ 
        time -= 1;      
        $("#timer").text(time + " seconds left...");
        if(time == -1)
        {
            location.reload();
        }
    }, 1000);

    setInterval(
    function(){ 
        y = Math.floor(Math.random()*300);
        x = Math.floor(Math.random()*600);
        $('html').append('<img class="mole" src="img/mole.png" width='+200+' height='+177+' style="position:absolute; top:'+y+'px; left:'+x+'px;" />');
    }, 1000);
});

Answer 1

这是因为在生成新事件后无法识别click事件。您需要重新定义事件。这样的事情。

$(document).ready( function() {

var pointcount = 0;
var time = 30;

$('#start_button').click(function() 
{

    $("#timer").text(time + " seconds left...");
    $("html").css('background-color', 'white');
    $("#howtoplay").text("");
    $("#start_button").attr("disabled",true);
    y = Math.floor(Math.random()*300);
    x = Math.floor(Math.random()*600);
    $('html').append('<img class="mole" src="img/mole.png" width='+200+' 
   height='+177+' style="position:absolute; top:'+y+'px; left:'+x+'px;"/>');

    $('.mole').click(function() { MoleClick() } )

    function MoleClick() {
        pointcount++;
        $("#score").text(pointcount + " points");
        y = Math.floor(Math.random()*300);
        x = Math.floor(Math.random()*600);
        $('.mole').remove();
        $('html').append('<img class="mole" src="img/mole.png" width='+200+' height='+177+' style="position:absolute; top:'+y+'px; left:'+x+'px;" />');
    }

    setInterval(
    function timer(){ 
        time -= 1;      
        $("#timer").text(time + " seconds left...");
        if(time == -1)
        {
            location.reload();
        }
     }, 1000);

    setInterval(
    function(){ 
        y = Math.floor(Math.random()*300);
        x = Math.floor(Math.random()*600);
        $('html').append('<img class="mole" src="img/mole.png" width='+200+' height='+177+' style="position:absolute; top:'+y+'px; left:'+x+'px;" />');

        $(".mole").unbind()
        $('.mole').click(function() { MoleClick() } )
    }, 1000);
});

Jquery生成的图像没有注册onclick

1 个答案: