Question

我正在尝试使用jquery，php和mysql数据库创建一个go-moku游戏。我有一个ajax函数，如果需要，每秒更新一块电路板。

var turnCount = -1;
setInterval(function(){
    $.get('includes/boardControl.php',{turn: turnCount }, function(data){
        if(data != "")
        {   $("#board").html(data);
            turnCount = $("#turnCount").text();
            $("#turnCount").text("")
        }
    });

}, 1000);

这很好用，它会检查数据库以查看转弯是否已经增加，如果有，则替换它。现在我想要最终做的是创建一个单击函数，该函数使用Ajax更新电路板并在数据库中转换计数。我希望以某种方式使用N'选择器来确定我点击的正方形。

我有几个问题。

1）我的点击功能现在是

$(document).ready(function() {
    $("td > img").click(function(){
        alert("clicked");
    });
});

现在它在我写入html的额外测试表上工作，但不在使用上一个函数创建的表上。我做错了什么？

2）到目前为止，我看过的教程规定我应该按照以下方式编写代码。

$(document).ready(function() {
  //code here
});

当我昨晚问了一个问题时，有人告诉我，我的功能让我感到困惑。那么什么时候我应该使用document.ready函数，什么时候不使用？将所有脚本放入一个document.ready函数或者我应该有多个吗？

第3） 一旦我点击图像工作，我希望将X，Y坐标发送到服务器并更改板上的相应位置。如何确定单击表格中的哪个单元格以了解要使用的坐标？（或者有更简单的方法吗？）

Answer 1

听起来你需要改变

$("td > img").click(function(){
                alert("clicked");
        });

到

$("td > img").live('click',function(){
                alert("clicked");
        });

编辑：对于jQuery 1.9及更高版本，你可以这样做：

$("#board").on('click', 'td > img', function(){
  // handle click
});

Answer 2

$(document).ready()函数仅在页面首次加载时触发 - 为了使这项工作尝试类似这样的事情：

function bindClicks() {
    $("td > img").click(function(){
        alert("clicked");
    });
}

$(document).ready(bindClicks);

如果需要绑定新表的点击事件，这将允许您稍后调用bindClicks()。

Answer 3

1）您是否在加载ajax内容后重新点击了click事件？

$(document).ready函数将在页面完全加载后立即触发，但在ajax调用后不会触发。因此，您需要在每次ajax调用后重新连接click事件：

2） KISS。保持尽可能简单。如果document.ready语句中有50多行，则可能需要创建一些函数。

3）实现此目标的最佳方法可能是为每个单元格分配一个特定的ID，并在click事件中捕获该ID。然后，您可以将其传递给服务器并更新返回的特定单元格。

Answer 4

您确定JQuery与您的查询匹配：

$（“td＆gt; img”）

我会用firebug加载firefox并检查你实际上是先获得匹配。您创建的第二个表格可能与您预期的结构略有不同，而firebug也可以向您显示确切的结构。

古德勒克。

jQuery click（）不能替换html

4 个答案: