Question

我正在动态加载包含一系列按钮的内容。我想在按下第一个按钮时触发第二个按钮，但触发事件永远不会触发。

的jQuery

$(document).on('click', '.main-button', function() {
    var self = $(this).attr('class').split(' ')[0];
    $('button.' + self + '.product-id').trigger('click');
});

HTML

<div class="button-wrap">
    <button class="b-1 main-button"></button>
    <button class="b-1 product-id"></button>
</div>
<div class="button-wrap">
    <button class="b-2 main-button"></button>
    <button class="b-2 product-id"></button>
</div>

Answer 1

您不需要实际类名中的点，只需要在css选择器中。而不是您想要的class="b-1 .main-button"：class="b-1 main-button"。其他类也一样。

注意：您还必须拥有产品按钮的onclick处理程序，否则您将无法看到点击。

＆＃13;

$(document).on('click', '.main-button', function() {
    var self = $(this).attr('class').split(' ')[0];
    $('button.' + self + '.product-id').trigger('click');
});

$(document).on('click', '.product-id', function() {
  var klass = $(this).attr('class');
  alert(klass + " prod button triggered");
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="button-wrap">
    <button class="b-1 main-button">B1 main</button>
    <button class="b-1 product-id">B1 prod</button>
</div>
<div class="button-wrap">
    <button class="b-2 main-button">B2 main</button>
    <button class="b-2 product-id">B2 prod</button>
</div>

＆＃13;

Answer 2

我解释你的问题的方式是：

当我点击attribute_时，会发生$taxonomy = 'pa_color'; $meta = get_post_meta($value['variation_id'], 'attribute_'.$taxonomy, true); $term = get_term_by('slug', $meta, $taxonomy); echo $term->name;点击。

第一个按钮的点击与类名称点击第二个按钮相关联，分别表示.b-1到.b-2和.b-1.main-button到.b-2.main-button。< / LI>

注意：您的代码错误地在HTML中错误地标记了您的类。因此改变：

.b-1.product-id

进入以下内容：

.b-2.product-id

现在进入处理 trigger() 的JQuery。这很简单。单击按钮时，在另一个按钮上触发单击事件：

<div class="button-wrap">
    <button class="b-1 .main-button"></button>
    <button class="b-1 .product-id"></button>
</div>
<div class="button-wrap">
    <button class="b-2 .main-button"></button>
    <button class="b-2 .product-id"></button>
</div>

<div class="button-wrap">
    <button class="b-1 main-button"></button>
    <button class="b-1 product-id"></button>
</div>
<div class="button-wrap">
    <button class="b-2 main-button"></button>
    <button class="b-2 product-id"></button>
</div>

如果我已正确解释您的问题，那么您应该有一个基于上述的解决方案。如有任何问题，请在下面的评论中提问。

使用包含动态内容的触发器

2 个答案: