Question

我正在将选择选项的值更改为ajax表单提交时的标签文本，但是我想在ajax成功时将其重置为原始值。

这是我修改提交内容时的选择方式。

  jQuery("select option").val(function(){
    return $(this).text();
  });

P.S我无法使用location.reload（）;

Answer 1

您可以使用.data()存储值，然后在需要时将其还原。

示例（没有实际的ajax调用，但应该可以给您一个提示）：

$(function() {
  $('form').on('submit', function (e) {
    e.preventDefault();
    
    var $options = $(this).find('select option');
    
    $options.val(function () {
      $(this).data('value', $(this).val());
      return $(this).text();
    });
    
    console.log($options.eq(0).val());
    console.log($options.eq(1).val());
    
    // ... Ajax stuff goes here ...
    
    // On ajax success:
    $options.val(function () {
      return $(this).data('value');
    });
    
    console.log($options.eq(0).val());
    console.log($options.eq(1).val());
  });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<form>
  <select>
    <option value="1">one</option>
    <option value="2">two</option>
  </select>
  
  <button>submit</button>
</form>

不相关的注意事项：通常建议使用比此更具体的选择器。您可以使用类，但是我建议自己使用data-属性作为选择器（将类留给CSS）。

如何在Ajax成功时恢复原始的选择选项值？

1 个答案: