javascript - 用输入值更新 DIV 的文本

Question

我正在尝试更新具有多个输入按钮的 div 的文本。单击输入按钮时，应将按钮的值传递给 div 并替换 div 中的文本。

它基本上是一个下拉菜单，当用户点击一个选项时它会关闭。出于明显的原因，我希望按钮的名称替换默认的“选择一个”。

它的结构是这样的:

                    <div class="button_slide" rel="slide1">Choose one</div>
                    <div class="content_slide slide1">
                        <input id="ButtonCake" class="button_vertical special_button" type="button" value="Cake" size="10px" />
                        <input id="ButtonNoCake" class="button_vertical special_button" type="button" value="No Cake" />                                                                            
                    </div>  

因此，当用户点击蛋糕时，我希望将“选择一个”更改为“蛋糕”。我有很多这些字段，所以真正通用的 jQuery 解决方案会很棒。感谢阅读。

Answer 1

$(".button_vertical").click(function() {
   $(".button_slide").text($(this).val());
});

如果你有多个 .button_slide div，给它们 ID，或者更好 - 使用父元素 <div>并使用:$(this).parent().children(".button_slide")