查找当前TD手机的位置,当点击

即时试图找到该用户已经点击了当前小区。 例如,如果用户点击第一个单元格,我想回到1。如果他们点击了第十单元我想回到10有16个细胞在表中。

<html> <head> <title>Lights Out!</title> <script type="text/javascript" src="jquery-1.4.js"></script> <script type= "text/javascript"> //The d var gameBoard = new Array(getTdCount()) for(var i =0; i < getTdCount(); i++) { gameBoard[i] = 0; } function getTdCount() { return $("td").length; } $(document).ready(function() { $("#board tr td").hover(function() { $(this).css('border-color', '00FF33'); }, function() { $(this).css('border-color', 'black') }) var $offProtoType = $('#offprototype').css('display', 'block').removeAttr('id') $('td').append($offProtoType) $("#board tr td").click(function() { $("img", this).attr('src', 'on.png') }) }); </script> <style type="text/css"> td { border-style:solid; border-color:black; background-color:black; float:left; } </style> </head> <body> <img style = "display:none" id="offprototype" src ="off.png"> <img style = "display:none" id="onprototype" src ="on.png"> <table id="board" border="3" bgcolor="black" align="center"> <tr> <td></td> <td></td> <td></td> <td></td> </tr> <tr> <td></td> <td></td> <td></td> <td></td> </tr> <tr> <td></td> <td></td> <td></td> <td></td> </tr> <tr> <td></td> <td></td> <td></td> <td></td> </tr> </table> <input type="button" value="Shuffle" onclick="change()"/> </body> </html>

--------------解决方案-------------

使用index

var $tds = $('#board tr td');
$tds.click(function(){
// Gets the 0 based index, and add 1:
var num = $tds.index(this) + 1;
$("img", this).attr('src', 'on.png')
});

我们首先缓存结果为#board tr td的搜索,所以我们不必看它在每一次点击。

接下来,我们得到使用index功能,查找当前的指数td出来的完整的结果td元素。

最后,我们加1,因为index会返回一个0计数值。

更新:jQuery的1.4

这不是一个实例是,我们可以利用新index()的jQuery 1.4的功能。 index()不带参数,获取元素的索引从它的兄弟姐妹的环境。 在这种情况下,我们需要它在所有的情况下td在表中的元素,而不仅仅是它的兄弟姐妹。

如果没有参数传递给.index()方法时,返回值是一个整数,指示第一个元素的jQuery对象相对于它的兄弟元素中的位置。

喜欢这个:

var cells = $('#board td')
cells.click(function() { alert(cells.index(this) + 1); });

的cellIndex属性都可以使用。

http://www.w3.org/TR/DOM-Level-2-HTML/html.html#ID-82915075

注意:有一个在Safari浏览器2和Konqueror一个错误的地方cellIndex始终为0。在这种情况下,一个功能测试和回退都可以使用。

分类:JavaScript的 时间:2012-01-01 人气:0
本文关键词: JavaScript的,jQuery的
分享到:

相关文章

  • 表明利用DataList控件JavaScript或jQuery的完整图像 2012-01-17

    我使用uplodify上传上传图片,并在DataList控件绑定它,我能够上传和DIND的图像,但现在我要显示一个大的预览图像. 该方案是 默认情况下,第一个图像应显示在大尺寸,之后当下一行的用户点击,然后下一行的形象应该在大尺寸显示,直到用户不点击其他行. 如何用JavaScript或jQuery的帮助下做到这一点. 请尽快帮我... 我是DataList控件 <asp:DataList ID="DataList1" runat="server" Repea

  • 如何调用PHP页面的JavaScript和jQuery的,当用户点击一个链接的href呢? 2012-01-27

    在PHP项目我有超链接: <a href="addid.php?id='. $Id . '">| Name |</a>'; 当用户点击链接,我需要选择"ID"添加到会话 addid.php代码: session_start(); $_SESSION['id'] = $_GET['id']; 我需要做到这一点无需重新加载页面(需要在"ID"添加到会话背景). 如何调用addid.php使用Javascript和jQuery的

  • 于JavaScript,jQuery的QTS 2012-02-01

    可能重复: 在Javascript请求地址 是否有任何检索当前页面的URL中的JavaScript或jQuery的方法? 请帮忙. --------------解决方案------------- window.location.href 这里是你会怎么做jQuery中:P (function($) { $.getUrl = function() { return window.location.href; } })(jQuery); 的jsfiddle. 警告 :显然,jQuery函数是爆笑.

  • 加载和使用的JavaScript和jQuery的Web服务 2012-02-02

    我们使用称为HTML敏捷性包在我们的.NET Web服务的HTML解析器. 我们解析使用这个解析器一些HTML页面,并提取一些内容. 虽然这个解析器是有用的,我们都在寻找更好的工作效率. 我们想知道,我们是否可以像我们用它在网页上提取内容加载javascript和jQuery的Web服务和使用jQuery. 这将使我们的工作轻松了许多. 如果我们不能做到这一点,我们可以利用的jQuery的力量,一些其他的方式? 我们很好奇,想知道一个解决方案. --------------解决方案-------

  • 什么是修复IE6 PNG trancparency用JavaScript和jQuery的最佳方法 2012-02-07

    有没有解决的JavaScript和jQuery使用任何插件或东西太复杂了IE6 PNG透明度什么简单的办法? --------------解决方案------------- 你可以用这个小插件来为你做它: http://jquery.andreaseberhard.de/pngFix/ 然而,主要的解决方案是围绕被包括在IE渲染引擎的过滤器. 这些可以通过CSS或JavaScript来添加. filter: progid:DXImageTransform.Microsoft.AlphaImage

  • 如何使用JavaScript或JQuery的插入HTML? 2012-02-20

    我希望能够插入,我已经与应选择为默认选项指定一个下拉框. 像下面的代码,其中首先应插入带有默认选中"BBB"(val2的〜BBB)一个下拉框. 这差不多的jsfiddle做什么,我需要的,但它存在的问题是: 应当可以定义哪个选项应该选择为默认 JavaScript的/ JQuery的应该是通用的,而不是硬编码到一个特定的ID 我想是这样的 <select> <script type='text/javascript'> insert_dropdown("

  • 使用Javascript(jQuery的)添加文本注释不要断行/无视他们的div容器 2012-02-23

    进出口工作基于JavaScript评论系统: 这是生成的html注释的JavaScript: $.each(comments.user,function(key,value) { comment_string += '<div class = "r_comment_header">'; comment_string+= '<a class = "r_comment_user" href = "profile.php?id=' + comm

  • 在“香草”​​的JavaScript,jQuery的没有在轨道4帖子AJAX请求 2012-02-28

    我做我的google搜索和搜索解决我的问题,并没有发现因为我的项目是如何奇怪的是,部分固溶体. 我试图做一个简单的聊天应用程序使用Rails只使用"香草"的JavaScript(jQuery的不还是允许Rails的佣工)4后端. 我有收集所有的种子消息数据并显示在聊天的GET Ajax请求的工作. 然而,当我尝试写一个POST请求我的Rails后端的,我遇到了两个主要问题. 它们可能会或可能不会被彼此相关. 第一个问题,我已经暂时解决,是一个422状态错误(无法处理的实体). 我相信这

  • 试图创建动态选择框的JavaScript和jQuery 2012-03-05

    我不是一个前端开发人员,我想创建一个选择框,添加它的选项完全动态地使用JavaScript和jQuery的. 我几乎没有,但我有一个问题,每次添加新的选择到div块(选择的数量在不同的时间是不同的). 到目前为止,我可以得到最后的选择中显示的下面的代码创建(但没有span标签) $('#meeting-eft-time-unit-data').append('<span>').html(se).append('</span>'); 或者我只是得到下面的列表... $('#meeti

  • 文字图像飞JavaScript或jQuery的 2012-03-08

    有什么办法或方法,以文本(字符串)图像转换JavaScript或jQuery的? 我找不到任何方式做到这一点. 什么是最好的? 我不想用PHP或asp.net做到这一点. 感谢您的任何技巧和帮助. --------------解决方案------------- 使用canvas元素,绘制文本到它. 的jsfiddle. 从字符串用PHP创建图像 <?php // Create a 100*30 image $im = imagecreate(100, 30); // White backgrou

Copyright (C) 55228885.com, All Rights Reserved.

55228885 版权所有 京ICP备15002868号

processed in 0.560 (s). 10 q(s)