从输入字段获取值并使用ajax传递到新页面，而无需提交表单

Question

I have a form which has an email field:

<input type="email" id="email" name="email"/>

And a verify button:

<span style="cursor:pointer">
 <p id="verify">Verify</p>
</span>

When user clicks on this verify , an input field(in verify_ajax.php) is loaded using following script which ask for verification code,

<script>
 $function()
 {
    $('#verify').click(function(){

    $('#getcode').load('verify_ajax') 

    }
 }
</script>

Here, getcode is where the ajax content will be loaded. Now, i want to pass email to the page verify_ajax (loaded in above function). I am new to all this ajax, please help me with this code.

UPDATE: I passed using ajax like:

<script>
 $function()
 {
    $('#verify').click(function(){

    $('#getcode').load('verify_ajax?email='+$('#email').val()) 

    })
 })
</script>

And, there is no error, verification code input is loading. But there is no email on verify_ajax, I think i am doing some mistake on that page: verify_ajax.php

if(isset($_GET['email'])
    echo 'Working'.$_GET['email']

This is showing only Working as output.

Answer 1

use form serialization and then send it to the page.

var data = $('#FormId').serializeArray();
$('#getcode').load('verify_ajax',data);