Плитки не всегда нажимаются с первого раза

У меня есть изометрическая карта с выбираемыми тайлами. Где плитки становятся «выделенными» при нажатии на них и возвращаются в нормальное состояние при нажатии на другую плитку. Это делается путем изменения фонового изображения на одно из выделенных плиток.

Однако я заметил, что плитки не всегда распознают, что они были нажаты при первом нажатии. Например, при первом запуске нажатие на ближайшую к экрану плитку обычно ничего не дает. Щелчок по нему еще раз или даже три раза, наконец, заставит его изменить цвет, но это требование многократного щелчка по-прежнему присутствует при попытке использовать другую плитку. В конце концов плитки будут меняться после одного щелчка, ИЛИ если нажать кнопку мыши на плитке в течение секунды, прежде чем отпустить.

В приведенном ниже примере вы можете увидеть мой обработчик события клика по плитке. Просто найдите «TODO» в коде JS. Проблема, вероятно, связана с двумя событиями щелчка по плитке. Можно ли решить эту проблему?

http://jsfiddle.net/briz/jdhPW/8/

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

ИЗМЕНИТЬ Я нашел решение! Я могу зарегистрировать плитки заранее, вызвав это так:

$.fn.gameMap.tileInfo = function(tile,x,y) 
    {
        // Registers each tile with their unique id
        tile.id = obj.attr('id') + '_tile_' + x + '_' + y;

        // When the tile gets clicked
        tile.click(function() 
        {
                        .....
        }

Тогда есть только один экземпляр события клика, и он каждый раз срабатывает при первом клике.


javascript jquery onclick
person Briz    schedule 17.11.2011    source источник
comment
Настройка обработчика кликов внутри обработчика кликов, вероятно, очень плохая идея.   -  person Pointy    schedule 17.11.2011
comment
@Pointy Верно, но я не знаю, как заставить его работать одним щелчком мыши, так как он должен зарегистрировать новую плитку и отменить выбор старой.   -  person Briz    schedule 17.11.2011
comment
Если у вас есть ответ, вы можете опубликовать его как ответ и принять его.   -  person Andrew    schedule 18.11.2011
comment
@ Эндрю О, я тогда, когда мне разрешат. Спасибо~   -  person Briz    schedule 18.11.2011

Ответы (1)


arrow_upward
1
arrow_downward

Я пошел и немного подчистил код, используя больше jQuery, чем в вашем оригинале.

$.fn.gameMap.tileInfo = function(tile,x,y) {
    // When the tile gets clicked
    tile.click(function() {
        // When the tile gets clicked again?
        var regularTile = "url(http://i244.photobucket.com/albums/gg10/brizthewhitedragon/WorkTilesWatermark.png)";
        $(".content .tile").css("background-image", regularTile);
        // Makes the tile apparently selected
        var selectedTile = "url(http://i244.photobucket.com/albums/gg10/brizthewhitedragon/WorkTilesSelected.png)";
        tile.css("background-image", selectedTile);
    });
};

Еще лучше было бы просто добавить событие щелчка к плиткам, как это, поскольку оно связывает их все сразу (хотя вам придется немного изменить структуру вашего кода...):

var tiles = $(".content .tile").click(function() {
    // When the tile gets clicked again?
    var regularTile = "url(http://i244.photobucket.com/albums/gg10/brizthewhitedragon/WorkTilesWatermark.png)";
    tiles.css("background-image", regularTile);
    // Makes the tile apparently selected
    var selectedTile = "url(http://i244.photobucket.com/albums/gg10/brizthewhitedragon/WorkTilesSelected.png)";
    tile.css("background-image", selectedTile);
});
person John Kalberer    schedule 17.11.2011