0

我在这里看到了一个例子并检查了它是如何工作的,但我得到了一个错误 - (见标题)

你知道为什么吗?

这是代码(类似于链接):

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<!--

  Created using /
  Source can be edited via /eyeyu/edit

-->
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<title>Sandbox</title>
<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
<style type="text/css" media="screen">
body { background-color: #000; font: 16px Helvetica, Arial; color: #fff; }
</style>
</head>
<body>
  <table border="1">
    <tr><td>1</td><td>2</td><td>3</td></tr>
    <tr><td>4</td><td>5</td><td>6</td></tr>
    <tr><td>7</td><td>8</td><td>9</td></tr>
  <tbody>
</table>
<script>
$('td').click(function(){
    var colIndex = $(this).parent().children().index($(this));
    var rowIndex = $(this).parent().parent().children().index($(this).parent());
    alert('Row: ' + rowIndex + ', Column: ' + colIndex);
});
</script>
</body>
</html>
4

1 回答 1

4

你的代码工作得很好!

执行的所有测试的问题可能来自缺少 jQuery 库,请参阅实时模拟链接print-screen

此外,这个工作小提琴示例!


作为旁注:

  • 您缺少结束标签,tbody并且开始标签乱序:

将您的 HTML 更新为此

<table border="1">
  <tbody>
    <tr><td>1</td><td>2</td><td>3</td></tr>
    <tr><td>4</td><td>5</td><td>6</td></tr>
    <tr><td>7</td><td>8</td><td>9</td></tr>
  </tbody>
</table>
  • 您的脚本标签缺少以下类型:

将您的标签更新为此

<script type="text/javascript">...</script>

<script src="path_to_jquery.js" type="text/javascript"></script>

已编辑 :: 为了更好地巩固这个答案

  1. 链接到正在运行的实时 HTML 文件
  2. 链接到未加载 jQuery 的实时 HTML 文件,从而导致错误!
  3. 不想点击链接的人的打印屏幕:

在此处输入图像描述

注意: 正如评论中的疯狂悬崖所述,在这种情况下不需要.ready() ,因为 jQuery 代码位于它选择的元素下方!

于 2012-05-19T10:21:42.287 回答