我有一个简单的表格,如:
<form method="get" accept-charset="UTF-8" id="serial_number" parsley-validate="">
<input type="hidden" name="_token" value="DTsfsdfsdf">
<input maxlength="200" type="text" name="serial" id="serial" required="required" class="form-control input-lg parsley-validated parsley-success" placeholder="Serial Number">
<input maxlength="200" type="text" name="pin" id="pin" required="required" class="form-control input-lg parsley-validated parsley-success" placeholder="Voucher PIN">
<input type="hidden" name="id" id="id" value="1">
<button name="foo" class="btn btn-primary nextBtn btn-lg pull-right full" type="submit">Next</button>
</form>
我尝试使用JQUERY提交此表单:
$("#serial_number").submit(function(e) {
$('.loadPage').toggle();
var url = "/getData";
$.ajax({
type: "GET",
url: url,
data: $("#serial_number").serialize(),
dataType: "json",
success: function(data) {
console.log(data);
if (!data.data) {
$('#error_message').empty();
$('#error_message').append('<div class="alert alert-info"><a href="#" class="close" data-dismiss="alert" aria-label="close"> ×</a><div class=""><i class="fa fa-info-circle" aria-hidden="true"></i> Sorry. Can you please call us on 345345345 so that we can help you. </div></div>');
$('.loadPage').toggle();
} else {
var secretS = $('#serial').val();
var secretP = $('#pin').val();
if ((data.data.hasOwnProperty("CanClaim") && data.data.CanClaim === true) || (secretS === '9999' && secretP === '9999')) {
var s = $('#serial').val();
var p = $('#pin').val();
item = {}
item["serial"] = s;
item["pin"] = p;
jsonObj.push(item);
if (secretS == '9999') {
$('#ChannelName').val('{{$user->def_virgin_channel}}');
$('#voucher_name1').html('TESTING');
$('#voucher_name2').html('TESTING');
maxDate = '12-12-2018';
} else {
if (data.data.Voucher.PromoCode == '.') {
cn = data.data.Voucher.ProductCode;
} else {
cn = data.data.Voucher.ProductCode + '_' + data.data.Voucher.PromoCode;
}
console.log('channel name: ' + cn);
cn1 = ChannelName[cn];
if (typeof cn1 !== "undefined") {
$('#ChannelName').val(cn1);
} else {
$('#ChannelName').val('{{$user->def_virgin_channel}}');
$('#good_channel').val(1);
}
console.log('channel name is: ' + cn1);
$('#voucher_name1').html(data.data.Voucher.Description);
$('#voucher_name2').html(data.data.Voucher.Description);
maxDate = data.data.Voucher.ExpiryDateWithGracePeriod;
}
$.ajax({
type: 'GET',
url: "/setup",
data: {
ChannelName: $('#ChannelName').val(),
id: $('#id').val()
},
success: function(data) {
console.log(data);
var url = "/getClosedDates"; // the script where you handle the form input.
WEEKDAYS = ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'];
days = [];
newArray = [];
m = data.data.MinOnlinePartySize;
p = data.data.MaxOnlinePartySize;
d = data.data.OnlinePartySizeDefault;
t = data.data.TermsAndConditions;
a = data.data.AcceptBookingsDaysInAdvance;
n = data.data.Name;
rn = data.data.ReservationPhoneNumber;
$.ajax({
type: "GET",
url: url,
data: {
ChannelName: $('#ChannelName').val(),
id: $('#id').val()
},
dataType: "json",
success: function(data) {
days = data.data.ClosedDays;
newArray = days.map(function(day) {
return WEEKDAYS.indexOf(day);
});
console.log(newArray);
covers(m, p, d);
$('#tos').html(t);
$('#res_name').html(n);
$('.res_name').html(n);
$('#res_phone').html(rn);
$('.res_phone').html(rn);
if (a == 'null') {
a = 1000;
}
$('#datum').datetimepicker({
useCurrent: false,
format: 'YYYY/MM/DD',
inline: true,
minDate: new Date(),
maxDate: maxDate,
daysOfWeekDisabled: newArray,
locale: 'en-gb'
});
$('#step-1').hide();
$('#step-2').show();
$(".step-2").addClass('btn-primary');
$('.loadPage').toggle();
},
error: function(data) {
console.log(data);
$('#myModal2').modal('show');
}
});
},
dataType: "json",
error: function(data) {
console.log(data);
$('#myModal2').modal('show');
}
});
console.log(data.data.Message.Code);
$('#voucher_name').html(data.data.Voucher.Description);
} else {
console.log(data);
$('#error_message').empty();
if (data.data.hasOwnProperty("Message")) {
$('#error_message').append('<div class="alert alert-info"><a href="#" class="close" data-dismiss="alert" aria-label="close"> ×</a><div class=""><i class="fa fa-info-circle" aria-hidden="true"></i> ' + data.data.Message.Description + ' </div></div>');
} else {
$('#error_message').append('<div class="alert alert-info"><a href="#" class="close" data-dismiss="alert" aria-label="close"> ×</a><div class=""><i class="fa fa-info-circle" aria-hidden="true"></i> ' + data.data.Description + ' </div></div>');
}
$('.loadPage').toggle();
}
}
},
error: function(data) {
console.log(data);
$('#myModal2').modal('show');
}
});
e.preventDefault();
});
我知道我发布了大部分代码,但这是必要的......我真的不知道发生了什么!试着整天调试这段代码。
究竟是什么问题?当我点击SUBMIT按钮时,我想运行jquery代码,这在Chrome和FireFox中运行良好,但是当我尝试使用IE11时,点击该按钮只需重新加载包含表单数据的页面。