Question

所以我有多个SPAN元素，每个元素都有输入字段。当我点击SAVE按钮时，我认为输入字段数据将替换SPAN数据（根据右边的div框-1或2）。

<a href="#" id="save-edit-button" data-attr="box2">SAVE</a>

<div id="box1-edit-area" >
    <li><span id="website" class="edit-text" style="display: inline; ">www.site.com</span>
        <input type="text" value="www.site.com" class="edit-input" id="website_input" >
    </li>

    <li><span id="first" class="edit-text" style="display: inline; ">first name</span>
        <input type="text" value="Roi" class="edit-input" id="first_input" >
    </li>
</div>  

<div id="box2-edit-area" >
    <li><span id="phone" class="edit-text" style="display: inline; ">97542668</span>
        <input type="text" value="97542668m" class="edit-input" id="phone_input" >
    </li>

    <li><span id="city" class="edit-text" style="display: inline; ">Paris</span>
        <input type="text" value="Paris" class="edit-input" id="city_input" >
    </li>
</div>

SCRIPT

$(document).ready(function()
{
    $(document).on('click', "#save-edit-button", function ()
    {
        DATA INSIDE THE INPUT FIELD SHOULD REPLACE THE RELEVANT SPAN
    });
});

Answer 1

$("#save-edit-button").click(function() {
  $("#box1-edit-area li input[type=text]").each(function() {
    $(this).prev().text($(this).val());
  });
});

使用上面的代码，看它是否有效。

这里发生了什么！

在$("#save-edit-button")上使用点击事件。

循环所有input[type=text] within li，检查prev标记并在其下添加当前input[text]的值。

jquery - 用输入字段替换spans

1 个答案: