0

我有一个网站，我试图在加载网站时使用 jQuery 自动点击图片。我正在使用 wordpress，代码在页脚中实现。该网站是https://mobimania.si/trgovina/ovitek-print-gold-mandala-copy/实际图片在“IZBERI MOTIV”部分。

我有代码，但由于某种原因它不起作用

jQuery("document").ready(function($) {
  setTimeout(function() {
    $("#mCSB_4.fpd-grid.fpd-item>picture").trigger('click');
  }, 10);
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<div id="mCSB_4" class="mCustomScrollBox mCS-light mCSB_vertical mCSB_outside" style="max-height: none;" tabindex="0">
  <div id="mCSB_4_container" class="mCSB_container mCS_y_hidden mCS_no_scrollbar_y" style="position:relative; top:0; left:0;" dir="ltr">
    <div class="fpd-grid fpd-grid-contain fpd-padding">
      <div class="fpd-item fpd-hidden" data-title="252105" data-source="/wp-content/uploads/2019/02/252105-e1551204819312.jpg" data-search="252105">
        <picture data-img="/wp-content/uploads/2019/02/252105-e1551204819312-188x300.jpg"></picture>
      </div>
    </div>
  </div>
</div>

4

2 回答 2

1

您的页面上有一些 JavaScript 错误，请修复它们。

关于您的问题：您的代码不起作用，因为您使用了错误的选择器，这个应该可以工作：

$("#mCSB_4 .fpd-grid .fpd-item > picture").trigger('click');

请注意空格，您有一个 id="mCSB_4" 的元素，该元素包含一个“fpd-grid”类元素，该元素包含一个“fpd-item”类元素，它有一个“图片子项”。

如果没有空格，您正在搜索 id="mCSB_4" 和那些类的元素。

于 2019-04-08T07:57:32.273 回答
0

你首先需要修复

<script>jQuery function() {

我建议

$(function() { 
  setTimeout(function() { 
    $("#mCSB_4").find("picture").trigger('click'); 
  },10); 
});

你的选择器是错误的。您正在尝试单击具有 id=mCSB_4 和两个.fpd-grid.fpd-item类的直接子项

这些都将起作用：

  • $("#mCSB_4").find("picture").trigger('click');

  • $("#mCSB_4 > .mCSB_container > .fpd-grid>.fpd-item > picture").trigger('click');
    直系后代和

  • $("#mCSB_4 .mCSB_container .fpd-grid .fpd-item > picture").trigger('click');
    仅使用带空格的类

注意这是假设该图片上有一个点击处理程序。

jQuery("document").ready(function($) {
  $("picture").on("click",function() {
    console.log("clicked")
  })
  setTimeout(function() {
    console.log("trying to click")
    $("#mCSB_4").find("picture").trigger('click');
  }, 10);
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<div id="mCSB_4" class="mCustomScrollBox mCS-light mCSB_vertical mCSB_outside" style="max-height: none;" tabindex="0">
  <div id="mCSB_4_container" class="mCSB_container mCS_y_hidden mCS_no_scrollbar_y" style="position:relative; top:0; left:0;" dir="ltr">
    <div class="fpd-grid fpd-grid-contain fpd-padding">
      <div class="fpd-item fpd-hidden" data-title="252105" data-source="/wp-content/uploads/2019/02/252105-e1551204819312.jpg" data-search="252105">
        <picture data-img="/wp-content/uploads/2019/02/252105-e1551204819312-188x300.jpg"></picture>
      </div>
    </div>
  </div>
</div>

于 2019-04-08T07:53:32.487 回答