按下假阅读更多按钮时触发点击标签

Question

结构如下：

div
  h1
    a
  p
  .more-info

当我点击 .more-info div 时，我需要模拟点击“a”。

 $(".more-info").click(function() {
   $(this).parent().find('h1').find('a').get(0).trigger('click');
 })

这会出现以下错误：

$(...).parent(...).find(...).find(...).get(...).trigger is not a function

输出

 console.log($(this).parent().find('h1').find('a').get(0))

是我需要点击的正确元素。

我已经尝试不使用 .get(0) 并在我记录时获得关注

 [a, prevObject: jQuery.fn.init(1), context: p.more-info, selector: "h1 a"]

Answer 1

.get(0)返回jQuery对象内的DOM元素，但.trigger()是jQuery函数，所以需要对jQuery对象进行操作。

但是，如果您在单击链接时尝试模拟浏览器的内置操作，.trigger() 将不会这样做。您需要调用 DOM 元素的 .click() 方法。

 $(".more-info").click(function() {
   $(this).parent().find('h1').find('a').get(0).click();
 });

见How to trigger a click on a link using jQuery

Answer 2

您可以使用元素的 .click() 方法，但我建议在 more-info 元素本身上放置一个链接。

无论如何，这应该可以：

$(this).parent().find('h1 > a').get(0).click();

在这里查看小提琴： https://jsfiddle.net/Lpyctuga/4/