javascript - jquery从dom类中抓取所有项目，并且已经实现了stopPropagation

Question

我遇到问题:

https://jsfiddle.net/codyc54321/2w0ymou7/

从 fiddle 中很难看出，但是当我单击其中一个粉红色框时，URL 是 http://fake-factory.readthedocs.org/en/latest/providers/internet.htmlhttps://media.readthedocs.org/pdf/factoryboy/latest/factoryboy.pdf ，或http://fake-factory.readthedocs.org/en/latest/providers/internet.html + https://media.readthedocs.org/pdf/factoryboy/latest/factoryboy.pdf .

根据之前的问题，我尝试通过多种方式阻止页面传播，最后一种是:

$('a').click(function(e){
  e.stopPropagation();
});

$('div').click(function(e){
  e.stopPropagation();
});

$('.article-link').click(function(e){
  e.stopPropagation();
});

问题涉及:

   $('.article-link').on('click',function(e){
      window.location = $( "article" ).find( ".url-text" ).text();
  });

它可以抓取链接，这很好，但是如果我在页面上有 5 个链接，它会将所有 5 个链接连接成 1 个。我尝试将每个框变成指向特定文章 url 的链接，以使其易于使用。为什么“stopPropogation”在这种情况下会被破坏？谢谢

Answer 1

发生的情况是它正在整理所有 .article-link 中的所有文本，而不是尝试使用单击的这个 div

//your code with $('article')
$('.article-link').on('click',function(e){
    window.location = $( "article" ).find( ".url-text" ).text();
});

使用$(this)代替

$('.article-link').on('click',function(e){
   window.location = $( this ).find( ".url-text" ).text();
});

应该可以解决问题...

***** 哦，是的，删除额外的点击监听器

$('a').click(function(e){
    e.stopPropagation();
});

$('div').click(function(e){
    e.stopPropagation();
});

$('.article-link').click(function(e){
   e.stopPropagation();
});

干杯

欢乐