如何解决输入值更改后,jQuery序列化不适用于克隆表单
我有一个带有文本输入字段的表单。输入字段之一称为问候,其值为“ Hello World”。
var $form = $('[name="form"]');
var $greetings = $form.find('[name="greetings"]');
console.log($greetings.val()); // prints 'Hello World'
我使用jQuery克隆此表单。
var $formToSubmit = $form.find(':not([data-dont-submit=true])');
var $formClone = $formToSubmit.clone();
然后我更改问候语输入的值,并检查其是否有效。
var $clonedGreetings = $formClone.find('[name="greetings"]');
$clonedGreetings.val('Goodbye');
console.log($clonedGreetings()); // prints 'Goodbye'
当我序列化克隆的表单时,输出具有问候语输入字段的旧值。
console.log($formClone.serialize()); // prints ...greetings=Hello+World
为什么会发生这种情况,并且如何可以让它序列化修改后的值?
下面的完整代码:
var $form = $('[name="form"]');
var $formToSubmit = $form.find(':not([data-dont-submit=true])');
var $formClone = $formToSubmit.clone();
var $greetings = $formClone.find('[name="greetings"]');
$greetings.val('Goodbye');
console.log($greetings.val()); // prints 'Goodbye'
console.log($formClone.serialize()); // prints ...greetings=Hello+World
更新: 我发现在表单克隆之前发生的另一个选择器导致了问题。该选择器从进一步处理和Ajax请求中排除了某些输入。我正在修改的输入字段没有将此属性设置为true,因此不排除它。
var $formToSubmit = $form.find(':not([data-dont-submit=true])');
我没想到这会产生任何影响,这就是为什么我最初省略该行的原因。请查看更新代码。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。