DIV с функцией onclick и изображением внутри нее имеет мертвую точку

#javascript #html

#javascript #HTML

Вопрос:

У меня есть DIV с изображением внутри него. Прямо перед изображением есть точка, которая не запускает функцию onclick при нажатии. Остальные, включая изображение и DIV, запускают функцию при нажатии. Я попытался прикрепить функцию к самому изображению в дополнение к DIV, и это не устраняет проблему. Кто-нибудь знает, что делать?

 //this give all the divs the function
var ButtonNumber = document.querySelectorAll(".ButtonStyle");
for (var i = 0; i < ButtonNumber.length; i  ) {
    ButtonNumber[i].onmouseover = ChangeCursor;
    ButtonNumber[i].onclick = ButtonsAddTogether;
    ButtonNumber[i].onselectstart = function() {return false;}
    }

Это HTML

  <div id="55" class="ButtonStyle"><img alt="1" class="Center" src="Buttons/7.png"></div>

1. Пожалуйста, поделитесь вашей разметкой / кодом, чтобы мы могли лучше устранить вашу проблему. Из того, что вы описали, это звучит так, как будто «пятно прямо перед изображением» либо не содержится в DOM, который выполняет действие, либо «покрыто» другим DOM с более высоким z-индексом.

2. Вы пробовали явно указывать фон для DIV?

3. Я использую Google Chrome, но получаю те же результаты в Safari. Я установил фон для DIV. Хотя это градиент.

Ответ №1:

Попробуйте установить одинаковую высоту изображения и div. Это или использовать встроенный элемент, а не блочный элемент, такой как тег привязки

Ответ №2:

Я поместил ваш код в jsfiddle:http://jsfiddle.net/BUwFP/1 /

Пожалуйста, посмотрите на это и скажите мне, работает ли это для вас. У меня только что:

определенные функции, которые не были определены (вероятно, вы просто пропустили их, показывая свой код),
добавлены границы для изображения и div, который его содержит,

и все выглядит нормально — нажатие на поле и т.д. запускает события. Проделайте аналогичную вещь и проверьте, действительно ли ваше поле находится там, где вы нажимаете, или каким-то образом оно было перемещено (возможно, с помощью стилей CSS или кода JS). Вы, наверное, уже знаете, что вы можете использовать Firebug в Firefox, инструменты разработчика в Chrome или что-нибудь подобное.

1. Я не могу найти плохое место на вашем. У меня уже есть аналогичная настройка. Примите, что мой css отличается. Мне интересно, в этом ли проблема. Я немного повозлюсь с этим. Спасибо за помощь.

2. Да, это может быть проблема с CSS. Используя CSS, вы можете изменить местоположение div, изменить его размер и т.д. — Таким образом, он может находиться не в том месте, которое вы обозначаете как «плохое место». Просто используйте Firebug или инструменты разработчика, чтобы добавить границу к div и проверить, есть ли она и какие стили заставляют ее перемещаться отсюда.