jQuery serialize hidden(display:none)表单elemens不起作用.解决方法？

Question

我有以下问题:

我有一个我需要序列化的表单,但我使用javascript来改变选择字段的外观.这意味着,使用display:none隐藏实际选择字段.我的问题是,jQuery确实识别隐藏的选择,但只序列化第一个值而不是选定的值.

<select name="publish">
<option value="1">yes</option>
<option value="2" selected="selected">no</option>
</select>

jQuery.serialzie:publish = 1

所以它给了我第一个而不是正确的价值.

任何解决方法的想法？

解决方案
好吧,正如RobW所提到的,最好的解决方案可能就是让JavaScript通过设置选择你想要的选项selectElement.selectedIndex = 5

然而,我的解决方案有点不同,因为我不想更改用于更改选择外观的插件,因为维护问题(例如,每次发布新版本时都需要更改脚本).我只是使用自定义函数进行序列化.

(function($) {
$.fn.serializer = function() {
    var toReturn    = [];
    var elements         = $(this).find(':input').get();
    $.each(elements, function() {
        if (this.name && !this.disabled && (this.checked || /select|textarea/i.test(this.nodeName) || /text|hidden|password/i.test(this.type))) 
        {
            var val = $(this).val();
            // if is select, check selected
            if(this.nodeName == "SELECT")
            {
                val = $(this).find('option:selected').val();    
            }
            toReturn.push( encodeURIComponent(this.name) + "=" + encodeURIComponent( val ) );
        }
    });
    return toReturn.join("&").replace(/%20/g, "+");
}
})(jQuery);

Answer 1

如果问题是由隐藏元素引起的,请在序列化之前临时显示它们:

var $form = $('#myForm');
var hidden = $form.find(':hidden'); // Select all hidden elements
hidden.show();                      // Show them
var string = $form.serialize();     // Serialize form
hidden.hide();                      // Hide them again

编辑:您似乎试图通过设置selected=selected属性来选择一个选项.您应该使用selectedIndex更改选定的选项:

var select = $("#myselect")[0]; //DOM element
select.selectedIndex = 5;       //Example, select 6th option