我试图在jQuery中做一个tictactoe项目，我有一个主要的问题…
瓦片位于< td>标签，我试图使它，以便当用户单击该图块时，它调用“标记”功能。
如果我们现在查看“标记”函数，$(this)将是< td>该函数被调用的节点。
然而，它没有做任何事情，所以我检查了控制台，显然$(这)包含DOM Window对象。
谢谢！
<script type="text/javascript">
var TURN_X = false;
var TURN_O = true;
var turn = false; // this is to see whos turn it is.
$(document).ready(function(){
var listCells = $.makeArray($("td"));
$("td").click(function(){marked(listCells)}); //THIS IS WHERE I HAVE PROBLEMS
return false;
});
function marked(arr)
{
console.log($(this)); // THIS CONSOLE LOG RETURNS "DOM Window"
$(this).addClass("marked");
if(turn == TURN_X)
{
this.innerHTML = "X";
turn = false;
}
else
this.innerHTML = "O";
var tileNum = $(this).attr("id");
}
解决方法
你的代码不遵循正确的原则。
$(function(){
var TURN_X = "X",TURN_O = "O",turn = TURN_O,$listCells = $("td");
function marked() { // define event handler
var $this = $(this),tileNum = $this.attr("id");
if ( !($this.hasClass("marked") ) {
$this.addClass("marked").text(turn);
turn = (turn == TURN_X) ? TURN_O : TURN_X;
}
}
$listCells.click(marked); // attach event handler
});
将所有内容包装在document.ready函数中。尽可能避免使用全局变量。>利用jQuery为你管理这个事实。如果您直接传递回调函数，而不是自己调用它们，这将永远是您期望的。
