我有一个脚本，其中正在执行这样的 ajax 调用：
(function () {
var setup, validation;
var errorMessage = '';
var errorClass = '';
var element = '';
var errorElement = '';
var allOk = true;
var testTelefon = /^[0-9\-+]{2,40}$/;
var testEpostAdress = /^(?!.{65})\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/;
(function () {
setup = {
init: function () {
this.initSendForm();
},
initSendForm: function () {
var self = this;
$('#helpContactForm').submit(function (event) {
if (allOk) {
var formData = self.getFormData();
var url = $(this).attr("action");
$.ajax({
cache: false,
type: "POST",
url: url,
data: formData,
success: function (data) {
if (data.Success) {
self.resetFormData();
self.showModal(data);
}
},
error: function (data) {
self.showModal(data);
}
});
}
self.hideModal();
event.preventDefault();
});
},
getFormData: function () {
var data = {
'Namn': $('#namn').val(),
'Email': $('#epost').val(),
'Telefon': $('#telefon').val(),
'Fraga': $('#fraga').val()
};
return data;
},
resetFormData: function () {
$('#namn').val(''),
$('#epost').val(''),
$('#telefon').val(''),
$('#fraga').val('')
return true;
},
showModal: function (data) {
$('#messageModalTitle').text(data.Caption);
$("#messageModalBodyText").text(data.Message);
$('#messageModal').modal('show');
return true;
},
hideModal: function () {
setTimeout(function () {
$('#messageModal').modal('hide');
}, 5000);
return true;
}
};
})();
(function () {
validation = {
valideraFormularet: function (errorMsgs) {
var errorMsgsArr = errorMsgs.split(","); //0=> Namn validerings meddel., 1=> Epost, 2=> Telefon, 3=> Fråga
var epost = document.getElementById("epost");
var telefon = document.getElementById("telefon");
this.valideraNamnet(errorMsgsArr[0]);
this.valideraEpostTelefon((errorMsgsArr[1] + ', ' + errorMsgsArr[2]), epost);
this.valideraEpostTelefon((errorMsgsArr[1] + ', ' + errorMsgsArr[2]), telefon);
this.valideraFraga(errorMsgsArr[3]);
return false;
},
valideraNamnet: function (errorMsg) {
var namn = document.getElementById("namn");
var namnError = document.getElementById("namnError");
if (namn.value == "") {
this.setErrorMsgAndClass(namn, namnError, "input-validation-error", errorMsg);
}
else {
this.setErrorMsgAndClass(namn, namnError);
return true;
}
allOk = false;
return false;
},
valideraEpostTelefon: function (errorMsg, ele) {
var result = errorMsg.split(","); //0=> När båda saknas, 1=> När epost saknas, 2=> När telefon saknas
var srcElement = document.getElementById(ele.id);
var epost = document.getElementById("epost");
var epostError = document.getElementById("epostError");
var telefon = document.getElementById("telefon");
var telefonError = document.getElementById("telefonError");
var errorElement = srcElement === epost ? epostError : telefonError;
var validEpost = testEpostAdress.test(epost.value);
var validTelefon = testTelefon.test(telefon.value);
if (epost.value == "" && telefon.value == "") {
this.setErrorMsgAndClass(srcElement, errorElement, "input-validation-error", result[0]);
}
else if (!validEpost && !validTelefon) {
this.setErrorMsgAndClass(srcElement, errorElement, "input-validation-error", srcElement === epost ? result[1] : result[2]);
}
else {
this.setErrorMsgAndClass(srcElement, errorElement);
return true;
}
allOk = false;
return false;
},
valideraTelefon: function (errorMsg) {
var result = errorMsg.split(",");
var telefon = document.getElementById("telefon");
var epost = document.getElementById("epost");
var telefonError = document.getElementById("telefonError");
var validTelefon = testTelefon.test(telefon.value);
if (telefon.value == "" && epost.value == "") {
this.setErrorMsgAndClass(telefon, telefonError, "input-validation-error", result[0]);
}
else if (validTelefon == false) {
this.setErrorMsgAndClass(telefon, telefonError, "input-validation-error", result[1]);
}
else {
this.setErrorMsgAndClass(telefon, telefonError);
return true;
}
allOk = false;
return false;
},
valideraFraga: function (errorMsg) {
var fraga = document.getElementById("fraga");
var fragaError = document.getElementById("fragaError");
if (fraga.value == "") {
fraga.style.borderColor = "#ffb6b6";
this.setErrorMsgAndClass(fraga, fragaError, "input-validation-error", errorMsg);
}
else {
fraga.style.borderColor = "#dddddd";
this.setErrorMsgAndClass(fraga, fragaError);
return true;
}
allOk = false;
return false;
},
setErrorMsgAndClass: function (el, errorEl, nameOfClass = '', errorMsg = '') {
element = el;
errorElement = errorEl;
errorClass = nameOfClass;
errorMessage = errorMsg;
this.setErrorMsgAndClassOnElements();
return false;
},
setErrorMsgAndClassOnElements: function () {
element.className = errorClass;
errorElement.textContent = errorMessage;
this.toggleSubmitBtn();
return false;
},
toggleSubmitBtn: function () {
allOk = errorClass == '' && $('.input-validation-error').length == 0 ? true : false;
if (!allOk)
document.getElementById("btnHelpFormSubmit").disabled = true;
else
document.getElementById("btnHelpFormSubmit").disabled = false;
}
};
})();
})();
这基本上是一个简单的“联系我们”表格。所以用户填写联系信息和问题。然后将表单提交到服务器（一个 asp.net mvc 控制器），响应（json），以感谢消息的形式显示在 Bootstrap 模式中，并在 5 秒后自动消失。
现在这在除 IE 11 及更低版本之外的所有浏览器中都可以正常工作（是的，我们必须支持这些浏览器，因为我们在某些使用这些浏览器的国家/地区拥有用户）。
问题是，当表单在 IE 中提交时，它不显示模式，而是要求用户下载（IE 窗口底部的小保存或打开消息）json 内容。IE 控制台中唯一的错误是“) 预期”。虽然我已经多次检查代码并且没有遗漏“）”（或者我是否忽略了？）。
这些可能是相互连接的问题，或者可能是 ajax 请求块中缺少某些内容，因此 IE 不显示模态，而是向用户提供下载 json 内容的选项，并且此括号错误与其他内容有关。
需要帮忙！
编辑：现在这是完整的代码。一些代码在另一个 JS 文件中，我在这里将它们合并在一起，因此它看起来与 Chrome 的源视图中的相同。
的函数定义setErrorMsgAndClass有一些默认参数值。
... function (el, errorEl, nameOfClass = '', errorMsg = '') { ... }
不幸的是，没有任何版本的 Internet Explorer 可以处理这样的默认参数，请参阅默认参数浏览器兼容性表。
相反，您可以使用类似于以下内容的“旧式”默认参数：
var x = function (el, errorEl, nameOfClass, errorMsg) {
nameOfClass = (typeOf nameOfClass != 'undefined') ? nameOfClass : 'Default Class Name';
errorMsg = (typeOf errorMsg != 'undefined') ? errorMsg : 'Default Error Message';
// code
}
x(a,b,c,d); // works
x(a,b); // works using the defaults instead of c/d
还有其他处理默认参数的方法示例，以便旧浏览器在上面链接的 MDN 页面的其余部分没有问题。
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句