存储表单 jQuery 中的文本 - Javascript

在开发 Web 应用程序时，存储表单数据是非常关键的。本文将介绍如何使用 jQuery 存储表单中的文本。

第一步：获取表单数据

在存储表单数据之前，我们需要先获取表单数据。我们可以使用 jQuery 的 val() 方法获取表单中文本框的值。

var name = $('input[name="name"]').val();
var email = $('input[name="email"]').val();
var phone = $('input[name="phone"]').val();

第二步：存储表单数据

有许多方法可以存储表单数据。这里我们使用 localStorage 来存储数据，当然你也可以使用 sessionStorage 或者 cookie。

localStorage.setItem('name', name);
localStorage.setItem('email', email);
localStorage.setItem('phone', phone);

第三步：获取存储的表单数据

我们可以使用 localStorage 中的 getItem() 方法来获取存储的表单数据。

var name = localStorage.getItem('name');
var email = localStorage.getItem('email');
var phone = localStorage.getItem('phone');

第四步：在页面加载时获取存储的表单数据

当页面重新加载时，我们需要将之前存储的表单数据显示出来。我们可以在 $(document).ready() 函数中获取存储的表单数据，并将其赋值给文本框。

$(document).ready(function() {
  $('input[name="name"]').val(localStorage.getItem('name'));
  $('input[name="email"]').val(localStorage.getItem('email'));
  $('input[name="phone"]').val(localStorage.getItem('phone'));
});

完整代码片段

$(document).ready(function() {
  // 获取表单数据
  var name = $('input[name="name"]').val();
  var email = $('input[name="email"]').val();
  var phone = $('input[name="phone"]').val();

  // 存储表单数据
  localStorage.setItem('name', name);
  localStorage.setItem('email', email);
  localStorage.setItem('phone', phone);

  // 获取存储的表单数据
  var name = localStorage.getItem('name');
  var email = localStorage.getItem('email');
  var phone = localStorage.getItem('phone');

  // 在页面加载时获取存储的表单数据
  $('input[name="name"]').val(name);
  $('input[name="email"]').val(email);
  $('input[name="phone"]').val(phone);
});

以上就是使用 jQuery 存储表单中的文本的完整代码片段。如果你想要存储其他类型的表单数据，比如单选框、复选框、下拉框等，只需要根据它们的类型使用相应的 jQuery 方法即可。