使用 jquery 将选择框值附加到多个框的上一个 p 标记

Append select box value to prev p tag for multiple boxes using jquery

本文关键字:上一个 标记 jquery 选择 使用      更新时间:2023-09-26

我有这样的代码,它将多次附加选择框。我必须将所选值附加到相应的 p class="managerName" 标签中。p 和选择框的组合将根据用户输入多次。需要在jquery中实现这一点。任何解决方案??面对问题

<p class="managerName"><span class='iconManager'></span></p>
<select onchange="SalesManager(this)" class="SalesManager">
   <option value="map roles">Map Roles</option>
   <option value="National_Manager">National Manager</option>
   <option value="Regional_Manager">Regional Manager</option>
   <option value="Area_Manager">Area Manager</option>
   <option value="Divisional_Manager">Divisional Manager</option>
</select>

您可以通过在 html 中进行微小更改来执行类似操作 - 因为即使在显示管理器值后,您似乎也希望保留图标

<p class="managerName"><span class='iconManager'></span><span class='manager'></span>
</p>
<select class="SalesManager">
    <option value="map roles">Map Roles</option>
    <option value="National_Manager">National Manager</option>
    <option value="Regional_Manager">Regional Manager</option>
    <option value="Area_Manager">Area Manager</option>
    <option value="Divisional_Manager">Divisional Manager</option>
</select>

然后

jQuery(function () {
    $('.SalesManager').change(function () {
        $(this).prev('.managerName').find('span.manager').html(this.value)
    });
})

演示:小提琴

试试这个:

$('#SalesManager').on('change',function () {
    $('p span[class=iconManager]').text(this.value);
});

在这里演示