这个JS / Jquery方法有什么问题？ （数组，点击事件）

Question

编辑 我发现了什么问题。如果你想看看你是否也能找到它，请随意。否则我在答案中发布了答案。

我会继续发布所有代码，因为我之前已经问过这个问题，但遗漏了我认为没有必要找到问题的东西，但是回答者想要所有的代码。

以下代码是根据我的其他一些代码建模的，它完全正常，但在这种方法中它不想工作。我有一个名为#container的初始div，它是俄克拉荷马州地图的图像，在该图像上，您可以看到该州的不同部分。在我的旧代码中，当用户点击某个细分受众群的某个区域时，它会切换#container div，并切换该细分受众群'放大'图片的图像的div。我的新代码应该使我的代码更简洁，它不会切换#container关闭（我怀疑不会切换新的div）。

我确定在用户点击时使用鼠标位置打开哪个细分（#region）。我使用像素坐标，我已经完成了数学计算以缩放这些坐标，因此无论屏幕尺寸是多少都是如此。

现在，这是新的和错误的代码：

$(document).ready(function()
{


//Main Oklahoma map
$("#container").click(function(e)
{
    var x = event.pageX;
    var y = event.pageY;

    const scaling_Screen_Max_Pixel_X = 1679;
    const scaling_Screen_Max_Pixel_Y = 924;

    // Math for the scaling of different sized windows
    var currentX = $(document).width();
    var currentY = $(document).height();
    var xScale = currentX/scaling_Screen_Max_Pixel_X;
    var yScale = currentY/scaling_Screen_Max_Pixel_Y;

    // Variables for different regions
    var zoneX = x/xScale;
    var zoneY = y/yScale;

    // Arrays containing the min and max x and y values of the rectangular area around a farm
    var minX = [47, 593, 593, 958, 600, 744, 852, 1025, 1060, 1159, 1366];
    var maxX = [553, 958, 792, 1011, 1124, 1124, 1149, 1598, 1280, 1623, 1551];
    var minY = [250, 250, 473, 349, 526, 665, 495, 248, 471, 520, 481];
    var maxY = [330, 473, 515, 478, 665, 721, 526, 471, 500, 763, 520];

    var regionNumber = [1,2,2,2,3,3,3,4,4,5,5];

    /** Loops through the values within the coordinate arrays to
        determine if the user clicked within a certain area **/
    for (var i = 0; i < minX.length; i++)
    {
        if(zoneX >= minX[i] && zoneX <= maxX[i] && zoneY >= minY[i] && zoneY <= maxY[i]) 
        {
            $("#region"+region[i]).toggle();
            $("#container").toggle(); //toggle off
        }
    }
   }); 
 });

minX，maxX等阵列中的坐标是有序的，因此这四个阵列中每个阵列中的第一个元素属于第一个区域（#region1）。我有regionNumber数组的原因是因为我为某些区域设置了多个“矩形”坐标，因为这些区域不是完美的矩形。

正如我之前所说，单击某个区域时没有任何反应。你看到问题出在这里了吗？

Answer 1

OOPS！坐在这里盯着我的代码，我意识到问题是什么。我忘了说$("#region"+regionNumber[i]).toggle();而不是$("#region"+region[i]).toggle();。

现在它运作得很好。感谢大家的关注！