为什么这个变量在函数之间传递时会发生变化
Why is this variable changing when passing it around functions?
Edit2:是的,发现了问题,ajax 调用中实际上有一个错误,由于我的愚蠢,我没有意识到这两种方法 - 成功和错误都可以运行(我认为它要么是其中之一),所以 formComplete 每次都被设置为 false,因为有错误。
感谢您给予的时间,并提示不要使用全局变量名称作为函数参数。
编辑:这是设置formComplete
的代码(控制台.log()在整个过程中检查表单完成):
validate: function(field) {
if(!field.val()) {
formComplete = false;
// formComplete is false here
console.log(formComplete);
}
else {
if(field.attr('name') === 'queryEmail') {
// Validate the email
if(DMOFFAT.helper.validateEmail(field.val()) === true){
// formComplete is either true or false here, depending on the last validation carried out
console.log(formComplete);
formComplete = true;
// formComplete is true here
console.log(formComplete);
}
else {
formComplete = false;
// formComplete is false here
console.log(formComplete);
}
}
else {
formComplete = true;
// formComplete is true here
console.log(formComplete);
}
}
},
问:为什么这个变量(formComplete)从真变成假?
我已经为联系表单编写了一些基本的表单验证,这是我是如何完成的:
定义字段如下:
var queryTypeField = $('#queryType'),
queryMessageField = $('#queryMessage'),
queryEmailField = $('#queryEmail'),
queryNameField = $('#queryName'),
submitButton = $('#submit');
添加一些事件处理程序,如下所示(FWIW,DMOFFAT 变量只是一个包含不同代码模块的对象,例如 contactForm = contact form javascript 等):
queryMessageField.on('blur', function() {
DMOFFAT.contactForm.validate(queryMessageField);
});
queryNameField.on('blur', function() {
DMOFFAT.contactForm.validate(queryNameField);
});
queryEmailField.on('blur', function() {
DMOFFAT.contactForm.validate(queryEmailField);
});
submitButton.on('click', function(evt) {
evt.preventDefault();
console.log('Click');
console.log(formComplete);
DMOFFAT.contactForm.send(formComplete);
});
验证函数只是将'formComplete'
设置为 true 或 false,具体取决于字段是否有效。
当我的字段都正确填写后,formComplete = true
.
正如你从上面代码的最后一行中看到的,我formComplete
(这是真的)传递给我的发送函数。我的 send 函数只是检查 formComplete
的值,然后要么将数据发送到 php 脚本,要么打印错误,代码如下:
send: function(formComplete) {
// This is true when the form is filled in correctly
console.log('In send formComplete is...' + formComplete);
if(formComplete === true) {
// Extract form values
formData['queryMessage'] = queryMessage.value;
formData['queryType'] = queryType.value;
formData['queryName'] = queryName.value;
formData['queryEmail'] = queryEmail.value;
$.ajax({
type: 'POST',
async: true,
url: '....',
dataType: 'json',
data: formData,
success: function(data, status, xhr) {
DMOFFAT.contactForm.writeMessage(formComplete);
},
error: function(xhr, status, err) {
DMOFFAT.contactForm.writeMessage(formComplete);
}
});
}
else {
this.writeMessage(formComplete);
}
现在,我知道当表单正确填写时formComplete
是正确的,因为我的 php 脚本创建了一个包含数据的.txt文件,如果它是假的,则不会创建此文件。
这意味着我们将 formComplete
的值发送到 writeMessage,它只是将一些 HTML 写出到页面以显示提交是否成功,以下是代码:
// Disgusting spaghetti code
writeMessage: function(formComplete) {
// This is false now...
console.log('In writeMessage formComplete is...' + formComplete);
if(formComplete === true) {
contactFormElement.html('<div class="success ui-message cf-message"><p><strong>Thank you</strong> for your query, we''ll get back to you as soon as we can.</p></div>');
}
else {
// Check if there's already an error, otherwise many will appear
if(errorElement === '') {
errorElement = '<div class="error ui-message cf-message"><p>' + this.config.errorMsg + '</p></div>';
contactFormElement.prepend(errorElement);
}
}
}
formComplete
本身的定义如下:
var formComplete;
当我在 writeMessage 的第一行检查表单完成时,它现在是错误的,我找不到为什么......即使我在传递给 writeMessage 之前明确地将formComplete
设置为 true,它仍然是假的。
TLDR:请告诉我我哪里傻了:)
PS:我知道我可以使用预先构建的联系表单验证插件,但想尝试自己构建一些简单的东西。
问题是,您正在从 AJAX 请求的回调函数调用writeMessage()
,因此解释器正在执行时查找全局变量。无论如何,你可以简单地在回调函数中将true
传递给writeMessage()
,因为调用仅在true
formComplete
时才执行 -
- 函数参数中的数据与指定变量之间的任何性能差异
- 在我的网站上创建一个在1-10之间不断变化的数字时遇到了问题.Javascript
- 从表列中检索日期,并根据从今天到日期之间的天数使行的颜色发生变化
- 在照片库中的两个元素之间切换样式会发生变化
- 起重行为在铬 48 和 49 之间发生了变化
- 为什么这个变量在函数之间传递时会发生变化
- 版本 2 和 3 之间的上传 API 有哪些主要变化
- 如何正确地通知聚合物中兄弟姐妹之间的数据变化
- 从顶部的偏移在动画的开始和结束之间发生变化
- 了解angular.copy()在1.0.7到1.2.26之间的变化
- 如何与Redux沟通React组件之间的UI状态变化
- 观察角度控制器之间的变化
- 随月份变化的两个日期之间的差
- 如何在两个不断变化的字符串之间选择中间文本
- jQuery暂停之间的动画和颜色变化
- 如何获得两个字符串之间的变化(插入,删除或相同)
- 如何将两个对象之间字段值的变化放入变量中?
- 控制器之间的值变化是不持久的
- AngularJS 1.2和1.4之间的重大变化
- 如何在两个或多个点之间画线?(积分可以动态变化)