为什么.each()找不到子元素?

时间:2013-07-09 10:38:23

标签: jquery forms each

e.target指向表单元素。我正在尝试遍历每个输入元素并收集名称和值,以便我可以将它们作为参数传递给a .load().each()迭代器永远不会找到<input>元素,因此在不处理任何内容的情况下退出。表单包含一个包含输入的div元素。

var formData = {};
$(e.target).has(":input").each(function(){
    formData[$(this).name] = $(this).value;
});

表单html:

<div id="partner-settings-form" class="ui-dialog-content ui-widget-content" scrolltop="0" scrollleft="0" style="display: block; width: auto; min-height: 67.6875px; height: auto;">         
<article class="sign_in form-dialog clearfix">
      <div class="bg-form-dlg">
        <div class="col_100 clearfix">
<h2>UPS Shipping Information</h2>
<form enctype="application/x-www-form-urlencoded" class="sign_in_form sign_up_form" action="" method="post"><div class="zend_form">

<input type="hidden" name="partnerId" value="2" id="partnerId">
<div class="shippingdetails"><fieldset id="fieldset-account">
<div id="key-label" class="formlabel"><label for="key" class="required">Access Key: *</label></div>
<div id="key-element" class="formcontent">
<input type="text" name="key" id="key" value="..."></div>
<div id="id-label" class="formlabel"><label for="id" class="required">User ID: *</label></div>
<div id="id-element" class="formcontent">
<input type="text" name="id" id="id" value="..."></div>
<div id="password-label" class="formlabel"><label for="password" class="required">Password: *</label></div>
<div id="password-element" class="formcontent">
<input type="text" name="password" id="password" value="..."></div>
<div id="account_number-label" class="formlabel"><label for="account_number" class="required">Account Number: *</label></div>
<div id="account_number-element" class="formcontent">
<input type="text" name="account_number" id="account_number" value="..."></div>
<div id="address1-label" class="formlabel"><label for="address1" class="required">Address1: *</label></div>
<div id="address1-element" class="formcontent">
<input type="text" name="address1" id="address1" value="..."></div>
<div id="address2-label" class="formlabel"><label for="address2" class="optional">Address2:</label></div>
<div id="address2-element" class="formcontent">
<input type="text" name="address2" id="address2" value=""></div>
<div id="phone-label" class="formlabel"><label for="phone" class="required">Phone: *</label></div>
<div id="phone-element" class="formcontent">
<input type="text" name="phone" id="phone" value="..."></div>
<div id="city-label" class="formlabel"><label for="city" class="required">City: *</label></div>
<div id="city-element" class="formcontent">
<input type="text" name="city" id="city" value="Los Angeles"></div>
<div id="state-label" class="formlabel"><label for="state" class="required">State (code): *</label></div>
<div id="state-element" class="formcontent">
<input type="text" name="state" id="state" value="CA"></div>
<div id="country-label" class="formlabel"><label for="country" class="optional">Country:</label></div>
<div id="country-element" class="formcontent">
<select name="country" id="country" class="dlg-select">
    <option value="US" label="UNITED STATES" selected="selected">UNITED STATES</option>
    <option value="AF" label="AFGHANISTAN">AFGHANISTAN</option>
    <option value="..." label="...">...</option>
</select></div>
<div id="postal-label" class="formlabel"><label for="postal" class="required">Postal Code: *</label></div>
<div id="postal-element" class="formcontent">
<input type="text" name="postal" id="postal" value="90036"></div></fieldset></div>
<div>
<p><label id="configship-label">&nbsp;</label>
<input type="submit" name="configship" id="configship" value="Save Information"></p></div></div></form></div>
</div>
</article>

    </div>

2 个答案:

答案 0 :(得分:3)

使用.serialize(),不需要重新发明轮子,交配。

$(e.target).serialize();

修改

由于.load()使用查询字符串请求GET,而使用对象请求POST,因此.serialize()不会删除它。解决方法是使用.ajax()或调整代码,因为你有错误:

var formData = {};
$(e.target).find('input').each(function() {
    formData[$(this).attr('name')] = $(this).val();  // .attr('name') and .val() instead.
});

答案 1 :(得分:2)

尝试不同的

$(e.target).find('input').each();