Jquery 序列化数组给了我空数组，如何修复？
我有一个由后端自动生成的表单。我试图序列化数组，但没有成功。我怎样才能找到错误 我已尝试使用jquery选择我的表单，该表单已找到。所有输入都有名称 这是HTMLJquery 序列化数组给了我空数组，如何修复？,jquery,ajax,Jquery,Ajax,我有一个由后端自动生成的表单。我试图序列化数组，但没有成功。我怎样才能找到错误 我已尝试使用jquery选择我的表单，该表单已找到。所有输入都有名称 这是HTML <div class="modal fade show" tabindex="0" role="dialog" id="modals-validation-tacite" data-idsource="validation-tacite" aria-modal="true" data-vivaldi-spatnav-clicka
<div class="modal fade show" tabindex="0" role="dialog" id="modals-validation-tacite" data-idsource="validation-tacite" aria-modal="true" data-vivaldi-spatnav-clickable="1" style="display: block; padding-right: 17px;">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">Validation de la Tacite</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<form action="#" method="POST" role="form">
<div class="container-fluid">
<input type="hidden" name="csrf" id="csrf" value="3573ee07287bcb2c29e124f673587e3712e67880dcf2fe76ec0b775132960b50-075d2c347340cd4fc527be7cdc2b5ee89224e749d3f995171d7bb112cdb57ab8" disabled="">
<div class="form-group row">
<div class=" col-12 col-md-6 text-sm-left text-md-right ">
<label for="nb-tacite" id="nb-tacite-label" class="form-control-label">Nombre de tacites <abbr class="required" title="champ obligatoire">*</abbr> :</label>
</div>
<div class=" mb-2 mb-md-0 col-12 col-md-6 ">
<input type="number" name="nb-tacite" aria-label="Nombre de tacites" id="nb-tacite" class="form-control" value="" disabled="">
</div>
</div>
<div class="form-group row">
<div class=" col-12 col-md-6 text-sm-left text-md-right ">
<label for="duree-tacite" id="duree-tacite-label" class="form-control-label">Durée de la tacite (en années) <abbr class="required" title="champ obligatoire">*</abbr> :</label>
</div>
<div class=" mb-2 mb-md-0 col-12 col-md-6 ">
<input type="number" name="duree-tacite" aria-label="Durée de la tacite (en années)" id="duree-tacite" class="form-control" value="" disabled="">
</div>
</div>
<div class="form-group row">
<div class=" col-12 col-md-6 text-sm-left text-md-right ">
<label for="duree-preavis-tacite" id="duree-preavis-tacite-label" class="form-control-label">Durée de préavis (en mois) <abbr class="required" title="champ obligatoire">*</abbr> :</label>
</div>
<div class=" mb-2 mb-md-0 col-12 col-md-6 ">
<input type="number" name="duree-preavis-tacite" aria-label="Durée de préavis (en mois)" id="duree-preavis-tacite" class="form-control" value="" disabled="">
</div>
</div>
<div class="form-group row">
<div class=" col-12 col-md-6 text-sm-left text-md-right ">
<label for="date-fin-tacite" id="date-fin-tacite-label" class="form-control-label">Date de fin de tacite <abbr class="required" title="champ obligatoire">*</abbr> :</label>
</div>
<div class=" mb-2 mb-md-0 col-12 col-md-6 ">
<input type="date" name="date-fin-tacite" aria-label="Date de fin de tacite" id="date-fin-tacite" class="form-control" value="" disabled="">
</div>
</div>
<div class="form-group row">
<div class=" col-12 col-md-6 text-sm-left text-md-right ">
<label for="date-maj-tacite" id="date-maj-tacite-label" class="form-control-label">Date de mise à jour dans GID <abbr class="required" title="champ obligatoire">*</abbr> :</label>
</div>
<div class=" mb-2 mb-md-0 col-12 col-md-6 ">
<input type="date" name="date-maj-tacite" aria-label="Date de mise à jour dans GID" id="date-maj-tacite" class="form-control" value="" disabled="">
</div>
</div>
<div class="form-group row">
<div class=" col-12 col-md-6 text-sm-left text-md-right ">
<label for="commentaire" id="commentaire-label" class="form-control-label">Commentaire :</label>
</div>
<div class=" mb-2 mb-md-0 col-12 col-md-6 ">
<textarea name="commentaire" aria-label="Commentaire" id="commentaire" class="form-control" disabled=""></textarea>
</div>
</div>
<div class="form-group row">
<div class=" col-12 col-md-6 text-sm-left text-md-right ">
<label for="tacite_flag" id="tacite_flag-label" class="form-control-label">GID est à jour <abbr class="required" title="champ obligatoire">*</abbr> :</label>
</div>
<div class=" mb-2 mb-md-0 col-12 col-md-6 ">
<div class="form-check">
<div class="form-check-label"> <input type="hidden" name="tacite_flag" value="0" disabled=""><input type="checkbox" name="tacite_flag" aria-label="GID est à jour" id="tacite_flag" aria-labelledby="tacite_flag-label" class="form-check-input" value="1" disabled=""></div>
</div>
</div>
</div>
</div>
</form>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal" data-idsource="validation-tacite">Fermer</button>
<button type="button" class="btn btn-primary modal-send" data-idsource="validation-tacite" data-vivaldi-spatnav-clickable="1" disabled="">Sauvegarder</button>
</div>
</div>
</div>
</div>
我应该得到一个包含所有键值的数组，但我从中得到的是空数组。编辑-虽然选择器可能也不正确，但真正的问题是禁用的表单元素 我认为您的选择不正确： 尝试： 请注意，告诉jQuery您正在寻找ID为modals validation tacite的元素。另外，不要让jQuery查找完整的表单元素，而是让它拾取输入元素。您的每一个INPUT类型的表单元素都被禁用。序列化数组跳过以下内容：
jQuery.fn.extend( {
serialize: function() {
return jQuery.param( this.serializeArray() );
},
serializeArray: function() {
return this.map( function() {
// Can add propHook for "elements" to filter or add form elements
var elements = jQuery.prop( this, "elements" );
return elements ? jQuery.makeArray( elements ) : this;
} )
.filter( function() {
var type = this.type;
/* RELEVANT CODE */
// Use .is( ":disabled" ) so that fieldset[disabled] works
return this.name && !jQuery( this ).is( ":disabled" ) &&
rsubmittable.test( this.nodeName ) && !rsubmitterTypes.test( type ) &&
( this.checked || !rcheckableType.test( type ) );
} )
.map( function( i, elem ) {
var val = jQuery( this ).val();
if ( val == null ) {
return null;
}
if ( Array.isArray( val ) ) {
return jQuery.map( val, function( val ) {
return { name: elem.name, value: val.replace( rCRLF, "\r\n" ) };
} );
}
return { name: elem.name, value: val.replace( rCRLF, "\r\n" ) };
} ).get();
}
} );
首先，如果您正在使用jQuery，并且希望序列化一些数据，则不需要form元素。您已经告诉JavaScript，您已经将包含所需输入的元素隐藏起来了。通过使用.serializeArray；或.序列化；，JavaScript将自动按照您从表单元素知道的方式运行，并将数据存储到数组中 请注意，.serializeArray还以JSON格式返回表单数据，而.serialize将以常规url编码格式返回数据 一个非常突出的错误是您的选择器，它似乎有一个输入错误。当您通过jQuery以特定元素为目标时，您需要准确地告诉它您的目标 示例： 这表示一个ID选择器， . 这表示类选择器 由于表单似乎是一个带有id的div元素，因此需要使用id选择器 例如： $'modals-validation-tacite' 所以你的变量应该是这样的： var formData=$'modals-validation-tacite'。序列化数组 还要注意的是，如果您的输入被禁用，那么serialize函数将跳过这些输入
希望这有帮助。谢谢您的回答。我在几分钟前尝试过，但仍然得到一个空数组。也许我的HTML与经典表单太不一样了。顺便说一下$'modals-validation-tacite input'。长度为8，因此我的元素被很好地选择。让它变得简单，为窗体指定id或类名，然后按id或类名将其序列化。我为窗体指定了id并尝试了$'formid'。serializeArray，但它仍然不工作。选择器来自具有id modals验证tacite的div元素，对吗？您的jQuery也应该被告知它正在选择器中定位一个id。即var formData=$'modals-validation-tacite'.serializeArray；。还要注意，serializeArray会将您的输入数据转换为JSON格式。@Martin感谢您的回答。表单位于目标div内，因此我指定它应该在div中查找表单标记。我尝试使用选择器，它会给出相同的结果。尝试将表单元素替换为具有适当id的div，以便从中进行选择，或者给出表单元素本身和id，并通过该特定id将其序列化。我们不需要更多信息来真正了解表单元素是否已禁用吗？在OP的问题中，disabled属性在我看来是空的。属性是否需要禁用=禁用才能禁用？元素已禁用是！所以序列化数组不起作用，是吗@MartinYes，如果禁用输入，则跳过它们。它将只序列化非禁用的输入：@莱伊oColetta@Martin-我同意属性应该有一个非空值，让我们相信元素已禁用。但是，规范中另有说明：感谢您的解释！然而，正如我对莱森所说的，提供身份证并没有帮助。
var formData = $('#modals-validation-tacite input').serializeArray();
jQuery.fn.extend( {
serialize: function() {
return jQuery.param( this.serializeArray() );
},
serializeArray: function() {
return this.map( function() {
// Can add propHook for "elements" to filter or add form elements
var elements = jQuery.prop( this, "elements" );
return elements ? jQuery.makeArray( elements ) : this;
} )
.filter( function() {
var type = this.type;
/* RELEVANT CODE */
// Use .is( ":disabled" ) so that fieldset[disabled] works
return this.name && !jQuery( this ).is( ":disabled" ) &&
rsubmittable.test( this.nodeName ) && !rsubmitterTypes.test( type ) &&
( this.checked || !rcheckableType.test( type ) );
} )
.map( function( i, elem ) {
var val = jQuery( this ).val();
if ( val == null ) {
return null;
}
if ( Array.isArray( val ) ) {
return jQuery.map( val, function( val ) {
return { name: elem.name, value: val.replace( rCRLF, "\r\n" ) };
} );
}
return { name: elem.name, value: val.replace( rCRLF, "\r\n" ) };
} ).get();
}
} );