How do I make $.serialize() take into account those disabled :input elements?
默认情况下,
暂时启用它们。
1 2 3 4 5 6 7 8 9 10 | var myform = $('#myform'); // Find disabled inputs, and remove the"disabled" attribute var disabled = myform.find(':input:disabled').removeAttr('disabled'); // serialize the form var serialized = myform.serialize(); // re-disabled the set of inputs that you previously enabled disabled.attr('disabled','disabled'); |
使用只读输入而不是禁用的输入:
1 | <input name='hello_world' type='text' value='hello world' readonly /> |
这应该由serialize()来处理。
您可以使用代理函数(它会影响
1 2 3 4 5 6 7 8 9 10 | (function($){ var proxy = $.fn.serializeArray; $.fn.serializeArray = function(){ var inputs = this.find(':disabled'); inputs.prop('disabled', false); var serialized = proxy.apply( this, arguments ); inputs.prop('disabled', true); return serialized; }; })(jQuery); |
@ user113716提供了核心答案。我在这里所做的只是通过向其中添加一个函数来实现jQuery的功能:
1 2 3 4 5 6 7 8 9 | /** * Alternative method to serialize a form with disabled inputs */ $.fn.serializeIncludeDisabled = function () { let disabled = this.find(":input:disabled").removeAttr("disabled"); let serialized = this.serialize(); disabled.attr("disabled","disabled"); return serialized; }; |
用法示例:
1 | $("form").serializeIncludeDisabled(); |
尝试这个:
1 2 | <input type="checkbox" name="_key" value="value" disabled="" /> <input type="hidden" name="key" value="value"/> |
我可以看到一些解决方法,但是仍然没有人建议编写自己的序列化函数?在这里,您可以前往:https://jsfiddle.net/Lnag9kbc/
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 | var data = []; // here, we will find all inputs (including textareas, selects etc) // to find just disabled, add":disabled" to find() $("#myform").find(':input').each(function(){ var name = $(this).attr('name'); var val = $(this).val(); //is name defined? if(typeof name !== typeof undefined && name !== false && typeof val !== typeof undefined) { //checkboxes needs to be checked: if( !$(this).is("input[type=checkbox]") || $(this).prop('checked')) data += (data==""?"":"&")+encodeURIComponent(name)+"="+encodeURIComponent(val); } }); |
如果有人不想激活它们,然后再次禁用它们,您也可以尝试执行此操作(我从serializeArray未选择的Disabled字段中进行了修改,从使用插件到使用常规功能):
1 2 3 4 5 6 7 8 | function getcomment(item) { var data = $(item).serializeArray(); $(':disabled[name]',item).each(function(){ data.push({name: item.name,value: $(item).val()}); }); return data; } |
因此,您可以这样称呼他们:
1 | getcomment("#formsp .disabledfield"); |
禁用的输入元素不会被序列化,因为按照W3C标准,"禁用"意味着不应使用它们。 jQuery只是遵守该标准,即使某些浏览器没有这样做。您可以解决此问题,方法是添加一个隐藏字段,其值与禁用字段相同,或者通过jQuery进行如下操作:
1 2 3 4 | $('#myform').submit(function() { $(this).children('input[hiddeninputname]').val($(this).children('input:disabled').val()); $.post($(this).attr('url'), $(this).serialize, null, 'html'); }); |
显然,如果您有多个禁用的输入,则必须迭代匹配的选择器等。
就在Aaron Hudon上:
也许您除了Input之外还有其他东西(例如select),所以我改变了
1 | this.find(":input:disabled") |
至
1 | this.find(":disabled") |