Question

我有隐藏和可见输入的表单，如下所示。在此示例中，我只想序列化名称='country'，而不是隐藏

<form id="finalform">
<input type='hidden' name='sid' value='901271316' />
<input type='hidden' name='tco_currency' value='USD'>
<input   name='country' value='India' />
</form>

我尝试了下面的代码，但它的序列化甚至是隐藏的输入。

var frm = $("form#finalform:visible");
 var add= JSON.stringify(frm.serializeArray());

Answer 1

使用下面的代码。 not(:hidden)不会包含隐藏在serialize()

中的输入类型

检查DEMO

var frm  = $('#finalform').find(":input:not(:hidden)").serialize();

或者

var frm  = $('#finalform :input:not(:hidden)').serialize();

样本

＆＃13;

var frm  = $('#finalform :input:not(:hidden)').serializeArray();

var frm1  = $('#finalform').find(":input:not(:hidden)").serializeArray();

$('#firstOutput').text(JSON.stringify(frm))
$('#secondOutput').text(JSON.stringify(frm1))

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<form id="finalform">
 <input type='hidden' name='sid' value='901271316' />
 <input type='hidden' name='tco_currency' value='USD'>
 <input   name='country' value='India' />
</form>


<div id="firstOutput"> </div>
<div id="secondOutput"> </div>

＆＃13;

Answer 2

我发现这是一种更清洁的方式：

var frm = $('#finalform [type!="hidden"]').serialize()

Answer 3

您可以在序列化之前制作它的临时副本并从中删除隐藏的输入：

var form = $("#finalform").clone();
$(form).find("input[type=hidden]").remove()
var serialized = $(form).serializeArray();

Answer 4

这是另一个可能的演示解决方案。

＆＃13;

var notHidden = $('#finalform > :not(input[type=hidden])').serializeArray();

$('#itemsSerializedCount').text($(notHidden).length)

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/json2/20140204/json2.js"></script>
<form id="finalform">
<input type='hidden' name='sid' value='901271316' />
<input type='hidden' name='tco_currency' value='USD'>
<input   name='country' value='India' />
</form>

<lablel id="itemsSerializedCount"></label>

＆＃13;

这里，未隐藏的输入控件被序列化。

跳过Jquery序列化中的隐藏输入

4 个答案: