Что не так с этим методом JS / Jquery?(Массивы, клик-событие) - PullRequest
0 голосов
/ 29 марта 2011

РЕДАКТИРОВАТЬ Я понял, что случилось.Если вы хотите посмотреть, сможете ли вы найти его тоже, не стесняйтесь.В противном случае я разместил ответ в ответах.

Я продолжу и выложу весь код, так как я задавал этот вопрос раньше, но оставил вещи, которые, по моему мнению, были не нужны для поиска проблемы., но отвечающие хотели получить весь код.

Следующий код смоделирован после некоторого другого моего кода, который прекрасно работает, но в этом методе он не хочет работать.У меня есть начальный 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, заключается в том, что у меня есть несколько «прямоугольных» наборов координат для некоторых областей, потому что области не являются совершенно прямоугольными.

Как я уже говорил, ничего не происходит, когда ящелкните регион.Вы видите, в чем здесь проблема?

1 Ответ

0 голосов
/ 29 марта 2011

OOPS! Сидя здесь, глядя на мой код, я понял, в чем проблема. Я забыл сказать $("#region"+regionNumber[i]).toggle(); вместо $("#region"+region[i]).toggle();.

Теперь все работает просто отлично. Спасибо за просмотр всех!

...