Jquery表单从字段值获取答案

【问题标题】：Jquery form get from field valueJquery表单从字段值获取
【发布时间】：2011-10-27 07:45:24
【问题描述】：

我在我的网站上使用 Jquery 表单。来自通常的字段（姓名、电子邮件、出生日期等）非常简单。用户按下注册按钮后，表单将使用 Jquery from 'ajaxForm' 参数提交到 php 文件。之后，表单滑出，谷歌地图滑入，要求客户通过拖动地图上的标记来选择他当前的位置。

标记放置在需要的位置后，客户可以点击“提交”按钮，两个值将被传递到另一个php文件：纬度和经度，即坐标。（请注意，页面不会随时刷新，这一切都发生在一个页面上。）

我想要做的是将先前表单中的电子邮件字段值与纬度和经度一起传递，但我不能真正做到这一点，因为我几乎是 javascript 的菜鸟。

有没有办法在提交表单之前从“电子邮件”字段声明一个全局变量，这样我以后可以使用它与纬度和经度参数一起传递。或者也许有更简单的解决方案？

非常感谢您！

这是我的 jquery 表单的代码

$(document).ready(function() {
var options = {
    target: '#total',
    clearForm: true,
    beforeSubmit: radio,
    success: social1
};
$("#perm").ajaxForm(options);

}); 
function radio(formData, jqForm, options) {

    if ($('input:radio').is(':checked')) {

} else {
    alert('choose gender!');
    return false;
}

var form = jqForm[0];

        if (form.year.value <= form.yob.value) { 
        alert('choose another year!'); 
        return false; 
    }

};




function social1() {  
            $("#map").delay(700).slideDown("slow");
            $("#accordion").slideUp("slow");
            };

这是按钮代码

<form id='perm' action='add.php?stay=perm' method='post' onSubmit="return checkForm(this);">

【问题讨论】：

标签： jquery google-maps jqueryform

【解决方案1】：

您已经在使用 beforeSubmit 方法。稍微扩展一下。这是捕获电子邮件地址的好地方。所以你最终会遇到这样的情况（未经测试）：

var email;
$(document).ready(function() {
var options = {
    target: '#total',
    clearForm: true,
    beforeSubmit: radio,
    success: social1
};
$("#perm").ajaxForm(options);

}); 
function radio(formData, jqForm, options) {
   email = $("#idOfEmailField").val();
   // ... rest of logic here
};
function social1() {  
   alert("Email address is "+email);
};

【讨论】：

【解决方案2】：

如果您只是隐藏表单而不刷新页面，则之前表单中的电子邮件输入仍然可用（即您无需声明全局变量来存储电子邮件）。例如，

<form id='perm' action='add.php?stay=perm' method='post'>
    ...
    <input type="text" id="name" />
    <input type="text" id="email" />
    <input type="submit" value="Submit" />
    ...
</form>

<button id='submitCoordinate_button' style='display:none'>Submit coordinate</button>

<script type="text/javascript">
    $('#perm').ajaxForm() {
        ...
        success: function() {
            $('#perm').hide(); // hide the perm form and pull the map in 
            $('#submitCoordinate_button').show();
        },
        ...
    }

    $('#submitCoordinate_button').click(function () {
        ...
        var email = $('#email').val(); // you still can get the email here
        ...
    });
</script>

【讨论】：