首页 \ 问答 \ 检查2D阵列中的对角线(Checking diagonals in a 2D array)

检查2D阵列中的对角线(Checking diagonals in a 2D array)

 我试图在图形XOOX的网格中找到对角线。 我有这个功能：  
function chkDiagonal(token, x,y){
  if(x >= 0 && x - 2 >=0 && y >= 0){
     if(token === "X"){
         if(gameBoard[x][y]==="X" && gameBoard[x-1][y+1] === "O" 
           && gameBoard[x-2][y-2] === "O" && gameBoard[x-3][y+3]==="X"){
            return true;
           }
        }
     }
   }
 }
 
 但是只有当我已经在board[x-3][x+3]有一个X board[x-3][x+3]它才会返回true我无法弄清楚如何使它更通用以便它只关心对角线上是否已经有两个O's ，并且不是X's两端放在什么顺序。 有人可以告诉我如何处理这个问题吗？  
 我正在测试它像这样：  
var gameBoard = [
       ["X", "O", "X", "O", "X", "O"],
       ["X", "O", "X", "X", "X", "O"],
       ["X", "O", "O", "O", "X", "O"],
       ["X", "O", "X", "O", "X", "O"],
       ["X", "O", "X", "O", "X", "O"]

      ];

console.log(chkDiagonal("X",4,0));//undefined

I am trying to find diagonals in a grid for the pattern XOOX. I have this function: 
function chkDiagonal(token, x,y){
  if(x >= 0 && x - 2 >=0 && y >= 0){
     if(token === "X"){
         if(gameBoard[x][y]==="X" && gameBoard[x-1][y+1] === "O" 
           && gameBoard[x-2][y-2] === "O" && gameBoard[x-3][y+3]==="X"){
            return true;
           }
        }
     }
   }
 }
 
but it only returns true if I already have an X at board[x-3][x+3] I cannot figure out how to make it more general so that it only cares if there are already two O's in a row diagonally, and not in what order the X's are placed on either end. Could someone advise me on how to approach this?  
I am testing it like this: 
var gameBoard = [
       ["X", "O", "X", "O", "X", "O"],
       ["X", "O", "X", "X", "X", "O"],
       ["X", "O", "O", "O", "X", "O"],
       ["X", "O", "X", "O", "X", "O"],
       ["X", "O", "X", "O", "X", "O"]

      ];

console.log(chkDiagonal("X",4,0));//undefined

原文：https://stackoverflow.com/questions/36417221

更新时间：2023-12-13 12:12

最满意答案

 您可以通过类news来定位悬停元素，并通过将news_img元素的id中的最后一个数字附加到news_img来查找目标元素  
$(document).ready(function () {
    $(".news").hover(function () {
        $('#news_img' + this.id.replace('news', '')).stop(true).animate({
            height: 'toggle'
        }, 290, function () {});
    });
});
 
 演示： 小提琴  
 
 您可以通过向图像添加一些data- *属性来删除悬停的css部分  
<img src="http://i853.photobucket.com/albums/ab100/vimeo1903/Showroom1_zps923b43dc.jpg" border="0" alt="Showroom1" data-hover="http://i853.photobucket.com/albums/ab100/vimeo1903/Showroom1_1_zpse41d0851.jpg" />
 
 然后  
$(document).ready(function () {
    //since the news elements has a common class, use it to target all the news elements instead of using individual ids
    $(".news").hover(function (e) {
        //you can find the `news_img` within the current news item using .find() instead of using its class to target it
        $(this).find('.news_img').stop(true).animate({
            height: 'toggle'
        }, 290);
        //find the image element within the current news
        var $img = $(this).find('.imgswap img');
        //if the current event is mouseenter then show the hover image else the src image
        //the hover handler registers 2 handler one for mouseenter another for mouseleave
        $img.attr('src', $img.data(e.type == 'mouseenter' ? 'hover' : 'src'));
    });
    //when we leaves the news elements we need to put back the original src, so store it using data api
    $('.news .imgswap img').each(function () {
        $(this).data('src', this.src);
    })
});

You can target the hover elements by its class news and find the target element by appending the last digits in the hovered element's id to news_img like 
$(document).ready(function () {
    $(".news").hover(function () {
        $('#news_img' + this.id.replace('news', '')).stop(true).animate({
            height: 'toggle'
        }, 290, function () {});
    });
});
 
Demo: Fiddle 
 
You can remove the css part of the hover by adding some data-* attributes to the image like 
<img src="http://i853.photobucket.com/albums/ab100/vimeo1903/Showroom1_zps923b43dc.jpg" border="0" alt="Showroom1" data-hover="http://i853.photobucket.com/albums/ab100/vimeo1903/Showroom1_1_zpse41d0851.jpg" />
 
then 
$(document).ready(function () {
    //since the news elements has a common class, use it to target all the news elements instead of using individual ids
    $(".news").hover(function (e) {
        //you can find the `news_img` within the current news item using .find() instead of using its class to target it
        $(this).find('.news_img').stop(true).animate({
            height: 'toggle'
        }, 290);
        //find the image element within the current news
        var $img = $(this).find('.imgswap img');
        //if the current event is mouseenter then show the hover image else the src image
        //the hover handler registers 2 handler one for mouseenter another for mouseleave
        $img.attr('src', $img.data(e.type == 'mouseenter' ? 'hover' : 'src'));
    });
    //when we leaves the news elements we need to put back the original src, so store it using data api
    $('.news .imgswap img').each(function () {
        $(this).data('src', this.src);
    })
});

检查2D阵列中的对角线(Checking diagonals in a 2D array)

最满意答案

相关问答

减少CSS代码表的多个css定义(reduce CSS code multiple css definitions for table)[2023-12-17]