0

I have defined a form like this:

<div id="zxRegisterDiv" style="display: none; border: 1px solid;">
    <style type="text/css">
        label.zxLabel{
            display: inline-block;
            width: 100px;
        }
    </style>
    <form id="zxForm" action="" method="get" onsubmit="return false;">
        <label for="zxUserName" class="zxLabel">*用户名：</label><input type="text" name="zxUserName" id="zxUserName"/><br/>
        <label for="zxPassword" class="zxLabel">*密码：</label><input type="password" name="zxPassword" id="zxPassword"/><br/>
        <label for="zxRePassword" class="zxLabel">*确认密码：</label><input type="password" name="zxRePassword" id="zxRePassword"/><br/>
        <label for="zxNickname" class="zxLabel">*姓名：</label><input type="text" name="zxNickname" id="zxNickname"/><br/>
        <label for="zxSex" class="zxLabel">*性别：</label><select name="zxSex" id="zxSex"><option value="0">男</option><option value="1">女</option></select><br/>
        <label for="zxEmail" class="zxLabel">*电子邮箱：</label><input type="text" name="zxEmail" id="zxEmail"/><br/>
        <label for="zxWechat" class="zxLabel">*微信：</label><input type="text" name="zxWechat" id="zxWechat"/><br/>
        <label for="zxQQ" class="zxLabel">*QQ：</label><input type="text" name="zxQQ" id="zxQQ"/><br/>
        <label for="zxMobile" class="zxLabel">*手机：</label><input type="text" name="zxMobile" id="zxMobile"/><br/>
        <label for="zxCertificate">*手机验证码</label><input type="text" name="zxCertificate" id="zxCertificate"/><input type="button" name="zxGetCertificate" id="zxGetCertificate" />
        <button type="submit" id="submit" onclick="$.ajax({url: '/front/suggestion/doRegister.htm',type: 'POST',data: $('#zxRegisterDiv form').serialize(),success: function (data) {if (data == 'ok') {alert('成功');}}});"></button>
    </form>
</div>

But when I use a jQuery selector like this:

$('#zxForm').serialize()

It doesn't serialize any data, because it can't select to my form "zxForm" at all! Why should this happen? How can I select the data from this form?

Tushar
  • 78,625
  • 15
  • 134
  • 154
Czyhandsome
  • 11
  • 8
  • Do you maybe have something else on the page with the same id? Please post a complete example. – Thilo Oct 26 '15 at 03:16
  • 2
    http://jsfiddle.net/arunpjohny/kycsn0bw/1/ ? – Arun P Johny Oct 26 '15 at 03:16
  • What _does_ `$('#zxForm')` give you instead? A jQuery object with 0 elements? Then it’s a duplicate of http://stackoverflow.com/questions/14028959/why-does-jquery-or-a-dom-method-such-as-getelementbyid-not-find-the-element. – Sebastian Simon Oct 26 '15 at 03:23
  • open your console. What errors is it giving? – PC3TJ Oct 26 '15 at 03:30
  • When I use $('#zxForm'), it gives me [object object], but when I use $('#zxForm')[0], it gives me undefined. @Xufox – Czyhandsome Oct 26 '15 at 03:33
  • @Czyhandsome `it gives me [object object], ` it always give you `[object][object]` but it doesn't mean that your dom element is actually selected.. I think the reason is you may use it before the form is actually loaded. try to put the `serialize()` in `$(document).ready(......` so that you can make sure that form is loaded. Have you checked the fiddle shared by Arun P Johny it worked so your form is ok. – Tintu C Raju Oct 26 '15 at 03:39

1 Answers1

1

The only thing i can think about is that your jquery is trying to serialize something that hasn't been loaded yet.

So you might try to wrap your

$('#zxForm').serialize()

Into

<script>
$(document).ready(function(){
    $('#zxForm').serialize()
});
</script>

Which it lets you load your page first before calling the script.

Azure
  • 36
  • 2