0

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

我将继续发布所有代码，因为我之前已经问过这个问题，但忽略了我认为对发现问题没有必要的东西，但回答者想要所有代码。

下面的代码模仿了我的一些其他代码，它工作得很好，但是在这种方法中它不想工作。我有一个名为的初始 div #container，它是俄克拉荷马州地图的图像，在该图像上您可以看到该州的不同部分。在我的旧代码中，当用户单击段的某个区域时，它会#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数组的原因是因为我有多个区域的“矩形”坐标集，因为这些区域不是完美的矩形。

正如我之前所说，当我单击一个区域时没有任何反应。你明白这里有什么问题吗？

4

1 回答 1

0

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

现在它工作得很好。谢谢大家看！

于 2011-03-29T13:29:18.210 回答