我正在尝试用 jQuery 制作一个 tictactoe 项目,但遇到了一个大问题......
瓷砖在<td>
标签,我试图做到这一点,以便当用户单击图块时,它会调用“标记”功能。
如果我们现在研究“标记”函数,$(this)
旨在成为<td>
调用该函数的节点。
然而,它没有做任何事情,所以我检查了控制台,显然$(this)
包含 DOM Window 对象。
无论如何我可以发送正确的类型吗$(this)
到“标记”功能?
谢谢你!
<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 管理的事实
this
为你。this
如果您直接传递回调函数而不是自己调用它们,那么将始终是您所期望的。
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)