Какой-то эквивалент, чтобы остановить распространение? - PullRequest
Новая
       14

Какой-то эквивалент, чтобы остановить распространение?

0 голосов
/ 04 февраля 2019

У меня проблема ...

Я пытаюсь получить идентификатор элемента, используя: 

$('div').on('click',function(ev){
     ev.stopPropagation();
     checkEl = $(this).attr('id');
     if(checkEl != 'topics' && checkEl != 'exfillVal' ){
          $("#topics").hide();
     }
  })

Но ... он также блокирует другие элементы с другим слушателем событий (нажмитесвое) ... Как мне этого достичь? 

$(function(){
var newHTML =[];
$('div').on('click',function(ev){
    ev.stopPropagation();
    checkEl = $(this).attr('id');
    if(checkEl != 'topics' && checkEl != 'exfillVal' ){
         $("#topics").hide();
         newHTML.push('<span class="reopen"  title="usuń">' + checkEl + '</span>');
    }
    $('#new').html(newHTML);
  })
  
  $('body').on('click', '.reopen',function(){ 
  $(this).hide();
  $("#topics").show();
  })
  
  // but that work
$('.reopen').on('click',function(){
  $(this).hide();
   $("#topics").show();
})


})
  
#main{
position:relative;
width:300px;
background-color:red;
}
div{
position:relative;
border:1px solid gray;
padding:15px;
width:100%:
}
#one{
background-color:black;
}
#two{
background-color:blue;
}#three{
background-color:orange;
}#four{
background-color:yellow;
}#fifth{
background-color:purple;
}
span{
padding:3px;}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="main">
<div id="one">
<div id="three">
<div id="four">
<div id="fifth">
</div>
</div>
</div>
</div>
<div id="topics">SOME COOL DATA </div>

</div>

<div id="new"></div>;

Как вы можете видеть, когда я нажимаю на div с идентификатором "один, два, три, четыре, пятый, основной" все работает ..... но когда щелкнул элемент промежутка дополнения ... Слушатель событий не работает корректно, потому что при добавлении элемент сложения скрывается при щелчке ... вместо того, чтобы просто создать еще один элемент .... где я создаю проблему?

Могу ли я заменить распространение на что-то еще?

Как я могу изменить код?

Любая помощь будет признательна

1 Ответ

0 голосов
/ 04 февраля 2019

Вы можете проверить, имеет ли обработчик отношение к исходному элементу или к родительскому элементу, сравнив ev.target с ev.currentTarget.Когда они одинаковы, то вы знаете, что клик действительно был для этого элемента, и вы смотрите не на родителя: 

$('div').on('click',function(ev){
     checkEl = $(this).attr('id');
     if (ev.target === ev.currentTarget && checkEl != 'topics' && checkEl != 'exfillVal' ){
         $("#topics").hide();
     }
});
...