События кликов накладываются на себя jQuery

Question

События кликов накладываются на себя jQuery

0

У меня проблема с событиями jQuery click.

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

Итак, этот HTML-код:

...
  <div id="element">
       <div id="button">
       </div>
  </div>
...

Код CSS:

#element{ 
    width: 100%;
    height: 100%;
    position: absolute;
}
#button{ 
    width: 64px;
    height: 64px;
    position: absolute;
    left: 50%;
}

Код jQuery:

 $('body').on('click', '#element',  function(){
      alert('element');
 });

 $('body').on('click', '#button',  function(){
      alert('button');
 });

И Исполнение:

если я нажму на #button, он покажет мне два предупреждения ("элемент") и ("кнопка"), но если я нажму на #button, я не хочу, чтобы действие click из #element.

Спасибо за любой ответ

user2899587 15 апр. 2014, в 14:17

Источник

0

держать кнопку снаружи элемента.
Mr_Green 15 апр. 2014, в 12:00
1

event.stopPropagation ()
Satpal 15 апр. 2014, в 12:00
0

спасибо сатпал, все работает.
user2899587 15 апр. 2014, в 12:03

Показать ещё 1 комментарий

Теги:

javascript

jquery

html

css

click

5 ответов

1

попробуй это

 $('body').on('click', '#button',  function(){
      alert('button');
      return false;
 });

Homungus 15 апр. 2014, в 10:46

1

Попытайтесь прекратить распространение детских событий у родителей

  $('body').on('click', '#element',  function(e){
     e.stopPropagation();
     alert('element');
  });

  $('body').on('click', '#button',  function(e){
    e.stopPropagation();
    alert('button');
  });

Bellash 15 апр. 2014, в 09:12

1

#button является дочерним элементом #element

 <div id="element">
    <div id="button"></div>
 </div>

Попробуйте сделать это

 <div id="element">Element</div>
 <div id="button">Button</div>

$('body').on('click', '#element',  function(){
      alert('element');
 });

 $('body').on('click', '#button',  function(){
      alert('button');
 });

4dgaurav 15 апр. 2014, в 09:12

1

Используйте оператор if на клике, чтобы показать предупреждение кнопки, если это кнопка, на которую нажата кнопка, а затем показать другое предупреждение.

Shakesy 15 апр. 2014, в 09:07

Ещё вопросы

держать кнопку снаружи элемента.

Milind Anantwar · Accepted Answer · 2014-04-15T10-45-00.000Z

use event.stopPropagation():

$('body').on('click', '#button',  function(e){
  e.stopPropagation();    
  alert('button');
});

Рабочая демонстрация