Warning: Cannot use a scalar value as an array in /home/admin/public_html/forum/include/fm.class.php on line 757

Warning: Invalid argument supplied for foreach() in /home/admin/public_html/forum/include/fm.class.php on line 770

Warning: Invalid argument supplied for foreach() in /home/admin/public_html/forum/topic.php on line 737
Форумы портала PHP.SU :: onclick внутри onclick

 PHP.SU

 Программирование на PHP, MySQL и другие веб-технологии
PHP.SU Портал     На главную страницу форума Главная     Помощь Помощь     Поиск Поиск     Поиск Яндекс Поиск Яндекс     Вакансии  Пользователи Пользователи


 Страниц (1): [1]   

> Описание: срабатывание 2=х onclick
Поиск в теме | Версия для печати
Hishchnik
Отправлено: 19 Декабря, 2013 - 10:04:17
Post Id



Новичок


Покинул форум
Сообщений всего: 36
Дата рег-ции: Май 2013  
Откуда: Мыски, Россия


Помог: 0 раз(а)
CODE (html):
скопировать код в буфер обмена
  1. <div class="Lists" onclick="onImg(\'on\',\''.$lists['name'].'.'.$lists['ext'].'\')" style="width:'.$w.'px;height:'.$h.'px;background-image: url('.$lists['files'].');background-size: '.$w.'px '.$h.'px;background-position: center center;background-repeat: no-repeat;">
  2. <a class="foto_del" onclick="onImg(\'del\',\''.$lists['name'].'.'.$lists['ext'].'\')" style="visibility: visible;">delete</a>
  3. </div>

CODE (javascript):
скопировать код в буфер обмена
  1. onImg function(a,b){
  2. alert(a+": "+b);}


div с фоновой картинкой, так же кнопка удаления в углу(предыстория)
при нажатии на фон сообщение только по "on"
при нажатии на кнопку, сначала "del" потом "on"

вопрос: Как разделить события?
 
 Top
Invert
Отправлено: 19 Декабря, 2013 - 10:14:54
Post Id



Частый гость


Покинул форум
Сообщений всего: 223
Дата рег-ции: Нояб. 2010  


Помог: 5 раз(а)
Попробуйте тег ссылки разместить за пределами div, и подогнать ссылку через css в нужное место (position: relative; left: ?; top: ?;)
 
 Top
Hishchnik
Отправлено: 19 Декабря, 2013 - 10:32:59
Post Id



Новичок


Покинул форум
Сообщений всего: 36
Дата рег-ции: Май 2013  
Откуда: Мыски, Россия


Помог: 0 раз(а)
Invert пишет:
Попробуйте тег ссылки разместить за пределами div, и подогнать ссылку через css в нужное место (position: relative; left: ?; top: ?;)


идея хорошая, пытался так делать, но дело в том, что этот кусок кода повторяется для вывода информации через "foreach" а позиция может меняться, думал, как вариант,
CODE (htmlphp):
скопировать код в буфер обмена
  1.  
  2. <div class="Lists">
  3. <div onclick></div>
  4. <div onclick></viv>
  5. <div>
  6.  

сделать, вот только первый внутренний нужен 100% площади div=Lists, а второй только кусочек div=Lists
то бишь, чего добиваюсь: кнопка удаления в углу фотографии(одно событие), при нажатии на любое место фото срабатывает другое событие

(Отредактировано автором: 19 Декабря, 2013 - 10:36:51)

 
 Top
Invert
Отправлено: 19 Декабря, 2013 - 10:50:31
Post Id



Частый гость


Покинул форум
Сообщений всего: 223
Дата рег-ции: Нояб. 2010  


Помог: 5 раз(а)
Я понял. Как вариант можно отказаться от onclick в пользу обработки событий через jQuery. Будет чище и понятнее код.

К примеру блоки будут выглядеть так:
CODE (html):
скопировать код в буфер обмена
  1.  
  2. <div class="Lists" data-param="$param">
  3.     <a class="foto_del">delete</a>
  4. </div>
  5.  


Вешаете обработчики событий:
PHP:
скопировать код в буфер обмена
  1.  
  2. $( '.Lists' ).click( function () {
  3.      // Это клик по блоку. Получаем данные и делаем что нужно
  4. });
  5.  
  6. $( '.foto_del' ).click( function () {
  7.      // Это клик по кнопке удаления. Получаем данные и делаем что нужно
  8. });
  9.  


Попробуйте. Это куда проще, чем ваш вариант.

(Отредактировано автором: 19 Декабря, 2013 - 10:52:03)

 
 Top
Hishchnik
Отправлено: 19 Декабря, 2013 - 11:06:46
Post Id



Новичок


Покинул форум
Сообщений всего: 36
Дата рег-ции: Май 2013  
Откуда: Мыски, Россия


Помог: 0 раз(а)
Invert пишет:
Я понял. Как вариант можно отказаться от onclick в пользу обработки событий через jQuery. Будет чище и понятнее код.

К примеру блоки будут выглядеть так:
CODE (html):
скопировать код в буфер обмена
  1.  
  2. <div class="Lists" data-param="$param">
  3.     <a class="foto_del">delete</a>
  4. </div>
  5.  



в том то и дело, что при нажатии на ссылку, срабатывает и событие div'a $( '.Lists' ).click( function ()
даже если с ссылки вообще убрать событие, и поставить только $( '.Lists' ) при нажатии на ссылку
CODE (htmlphp):
скопировать код в буфер обмена
  1. <a class="foto_del" style="visibility: visible;">delete</a>
происходит срабатывание @Lists@

(Отредактировано автором: 19 Декабря, 2013 - 11:14:38)

 
 Top
Invert
Отправлено: 19 Декабря, 2013 - 11:16:34
Post Id



Частый гость


Покинул форум
Сообщений всего: 223
Дата рег-ции: Нояб. 2010  


Помог: 5 раз(а)
Hishchnik пишет:
в том то и дело, что при нажатии на ссылку, срабатывает и событие div'a $( '.Lists' ).click( function ()
Точно.

Тогда используйте отдельные слои для событий, как вы писали ранее:
CODE (html):
скопировать код в буфер обмена
  1.  
  2. <div class="Lists">
  3. <div onclick></div>
  4. <div onclick></viv>
  5. <div>
  6.  
 
 Top
IllusionMH
Отправлено: 19 Декабря, 2013 - 11:17:22
Post Id



Активный участник


Покинул форум
Сообщений всего: 4254
Дата рег-ции: Февр. 2011  
Откуда: .kh.ua


Помог: 242 раз(а)
Hishchnik, return false в конце обработчика клика по ссылке.
еще смотрите в сторону event.stopPropagation()
 
 Top
Invert
Отправлено: 19 Декабря, 2013 - 11:20:20
Post Id



Частый гость


Покинул форум
Сообщений всего: 223
Дата рег-ции: Нояб. 2010  


Помог: 5 раз(а)
IllusionMH пишет:
return false
Точно. IllusionMH дело говорит.
 
 Top
esterio
Отправлено: 19 Декабря, 2013 - 12:00:03
Post Id



Активный участник


Покинул форум
Сообщений всего: 5025
Дата рег-ции: Нояб. 2012  
Откуда: Украина, Львов


Помог: 127 раз(а)
ну и также
CODE (javascript):
скопировать код в буфер обмена
  1. e.preventDefault();

http://stepansuvorov[dot]com/blog/20[dot][dot][dot]iatepropagation/
 
 Top
IllusionMH
Отправлено: 19 Декабря, 2013 - 12:03:25
Post Id



Активный участник


Покинул форум
Сообщений всего: 4254
Дата рег-ции: Февр. 2011  
Откуда: .kh.ua


Помог: 242 раз(а)
esterio, return false = e.preventDefault() + e.stopPropagation(). И в данном случае подходит.
 
 Top
esterio
Отправлено: 19 Декабря, 2013 - 13:03:10
Post Id



Активный участник


Покинул форум
Сообщений всего: 5025
Дата рег-ции: Нояб. 2012  
Откуда: Украина, Львов


Помог: 127 раз(а)
IllusionMH
Не знаю, chrome материться на устаревшую конструкцию, если return false. Хотя тут дело привичкы, ведь результат одинаков.
 
 Top
IllusionMH
Отправлено: 19 Декабря, 2013 - 13:20:40
Post Id



Активный участник


Покинул форум
Сообщений всего: 4254
Дата рег-ции: Февр. 2011  
Откуда: .kh.ua


Помог: 242 раз(а)
esterio, он матерится сразу при загрузке, т.к. этот параметр проверяется в любом событии через ||. Я бы сказал что это "проблема" самого jQuery, который проверяет это значение у события.
Просто V8 выводит сообщения если устаревшие методы/свойств вызываются, а в 1.x еще осталась поддержка старых ИЕ.
Если попробовать глянуть что в этой строке после return false; то можно увидеть что это не влияет на параметр src.returnedValue
http://take.ms/vOJXn

(Отредактировано автором: 19 Декабря, 2013 - 13:21:34)

 
 Top
Hishchnik
Отправлено: 19 Декабря, 2013 - 14:47:57
Post Id



Новичок


Покинул форум
Сообщений всего: 36
Дата рег-ции: Май 2013  
Откуда: Мыски, Россия


Помог: 0 раз(а)
пост снят с отображения

(Отредактировано автором: 19 Декабря, 2013 - 18:28:08)

 
 Top
Hishchnik
Отправлено: 19 Декабря, 2013 - 17:15:48
Post Id



Новичок


Покинул форум
Сообщений всего: 36
Дата рег-ции: Май 2013  
Откуда: Мыски, Россия


Помог: 0 раз(а)
Вопрос снимается, доизвращался до такого:
CODE (html):
скопировать код в буфер обмена
  1. .List{float:left;display:block;background:#EFEFEF;border:1px solid #D5DFE5;padding:3px;margin:2px;}
  2. .List:hover {float:left;display:block;background:#FFFFFF;border:1px solid #3399FF;padding:3px;margin:2px;}
  3. .List .foto_del{width:18px;height:18px;position:relative;top:-5px;right:-45px;background:url(img/icon/del_icon.png) no-repeat 0 0;cursor:pointer;display:inline-block;text-indent:-999em;visibility:hidden;z-index:999}
  4. .List .bgimg{position:relative;top:-18px;}
  5.  
  6.  
  7. <div class="List" style="width:'.$w.'px;height:'.$h.'px;">
  8. <div class="foto_del" onclick="onImg(\'del\',\''.$lists['fname'].'\'); return false;" style="visibility: visible;">delete</div>
  9. <a onclick="return true;">
  10. <img class="bgimg" style="width:'.$w.'px;height:'.$h.'px;" onclick="onImg(\'on\',\''.$lists['fname'].'\')" src="'.$lists['files'].'" />
  11. </a>
  12. </div>
  13.  


вот теперь всё как надо Закатив глазки
Что получилось в прикрепленном файле(2 нажатия на разные ссылки)
Прикреплено изображение (Нажмите для увеличения)
2.jpg

(Отредактировано автором: 19 Декабря, 2013 - 18:28:36)

 
 Top
Поиск в теме | Версия для печати
Страниц (1): [1]
Сейчас эту тему просматривают: 0 (гостей: 0, зарегистрированных: 0)
« JavaScript & VBScript »


Все гости форума могут просматривать этот раздел.
Только зарегистрированные пользователи могут создавать новые темы в этом разделе.
Только зарегистрированные пользователи могут отвечать на сообщения в этом разделе.
  



Powered by PHP  Powered By MySQL  Powered by Nginx  Valid CSS  RSS

 
Powered by ExBB FM 1.0 RC1. InvisionExBB