Первые два из пяти изображений не попадают на клик, а только в Chrome - PullRequest
1 голос
/ 20 сентября 2010

Обратите внимание на следующую до боли простую конструкцию:

<div id="home_thumbnails"> 
    <img onClick='loadFeature(0);' src='image_1.jpg'> 
    <img onClick='loadFeature(1);' src='image_2.jpg'> 
    <img onClick='loadFeature(2);' src='image_3.jpg'> 
    <img onClick='loadFeature(3);' src='image_4.jpg'> 
    <img onClick='loadFeature(4);' src='image_5.jpg'> 
</div> 

В Firefox это происходит именно так, как объявлено.

В Chrome, однако, loadFeature не вызывается для первых двух изображений .У меня есть alert() в верхней части function loadFeature(), который показывает, что функция даже не вызывается первыми двумя.Остальные три, однако, называют это просто великолепно.

Любое объяснение этого было бы НАМНОГО оценено

Ответы [ 3 ]

5 голосов
/ 20 сентября 2010

Вот воссоздание того, что могло бы произойти .

Вероятно, есть прозрачный div или изображение, покрывающее первые два изображения.

Например, возьмите этот безобидный код:

<html><body>
<script type="text/javascript">
    function loadFeature(number)
    {
        alert(number);
    }
</script>
<div id="important"></div>
<div id="home_thumbnails">
    <img onClick='loadFeature(0);' src='image1.jpg'>
    <img onClick='loadFeature(1);' src='image2.jpg'>
    <img onClick='loadFeature(2);' src='image3.jpg'>
    <img onClick='loadFeature(3);' src='image4.jpg'>
    <img onClick='loadFeature(4);' src='image5.jpg'>
</div>​
</body></html>

Объедините приведенный выше код с изображениямишириной X и высотой Y и следующим CSS:

#important {
    width:2Xpx;
    height:Ypx;
    position:absolute;
    top:0;
    left:0; }​

и ваши первые два изображения не активируются.

2 голосов
/ 20 сентября 2010

Это может быть странно, но проверьте, не перекрываются ли другие элементы с первыми двумя изображениями. Возможно, вы на самом деле нажимаете на этот элемент, а не на изображения, поэтому событие onclick не будет срабатывать для img элементов.

2 голосов
/ 20 сентября 2010

Я только что проверил это в Chrome, и он работает без помех:

<script type="text/javascript">
    function loadFeature(number)
    {
        alert(number);
    }
</script>

<div id="home_thumbnails">
    <img onClick='loadFeature(0);' src='image_1.jpg'>
    <img onClick='loadFeature(1);' src='image_2.jpg'>
    <img onClick='loadFeature(2);' src='image_3.jpg'>
    <img onClick='loadFeature(3);' src='image_4.jpg'>
    <img onClick='loadFeature(4);' src='image_5.jpg'>
</div>

Возможно, вы захотите убедиться, что ничто не может удалять или заменять ваши события onClick или что никакие скрытые / невидимые элементы не скрывают / не покрывают часть вашего div / изображений. Если это не так, не могли бы вы опубликовать еще немного своего кода (например, функцию loadFeature)?

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...