Question

我有一个使用高级自定义字段的自定义循环，它会显示三个包含内容的框。

如果已选中框1中的按钮，我希望框1中的内容填充到输入中。

如果选中了方框2中的按钮，我希望方框2中的内容填充到输入中，依此类推。

我的html如下：

<div class="row">
    <?php if( have_rows('event') ): while ( have_rows('event') ) : the_row(); ?>
        <div class="four">
            <div class="input"><?php the_sub_field('details'); ?></div>
            <a class="button btn" href="#contact">Make an appointment</a>
        </div>
    <?php endwhile; else : endif; ?>
</div>

<input id="output"></input>

我的jQuery是：

jQuery(document).ready(function($) {
    $(".btn").click(function(e) {
        $("#output").val($(".input").val());    
    });
});

我已经设法找到一个盒子的工作解决方案但不是循环，我怀疑它可能与.each（）有关但我不确定。

感谢。

Answer 1

你的jQuery非常接近。

有两个问题：

您正在尝试使用div的{{1}}，value没有text - 它有.text（或html），因此您需要使用.text()（或.html()）。在您的情况下，我相信.input就是您追求的目标。
当您想要点击与该按钮相关的.input时，您将第一个 // Short-hand document ready (which is no-conflict safe, necessary in WP scripts) jQuery(function($) { $(".btn").click(function(e) { // $(this) is this button - get the sibling .input element's text $("#output").val($(this).siblings(".input").text()); }); });元素的值放入输入中。有几种方法可以做到这一点，但在你的情况下，最直接的方法是使用.siblings。
```
.undim
```

Answer 2

你只需要获得点击按钮的兄弟输入。但是，您需要让div class="input" input的实际.val()生效。否则，您必须使用.text()来获取div中的文本。

jQuery(document).ready(function($) {
    $(".btn").click(function(e) {
        $("#output").val($(this).siblings('.input').val());    
    });
});

根据循环中的哪个按钮点击填充字段

2 个答案: