Angular JS - iOS 8 - iPad Air:全屏应用继续关闭
问题描述:
我有一个页面,HTML5-jQuery。它在Mobile Safari和Chrome上运行良好。但是,当全屏打开时,它的行为真的很奇怪。有一个'保存'链接(#updateLink),通过web服务发送更新的文本并接收成功/失败响应。一旦我收到回复,应用程序会突然关闭。这仅在全屏模式下发生。Angular JS - iOS 8 - iPad Air:全屏应用继续关闭
HTML:
<div id="footerAnnouncementsDiv" class="footerAnnouncementsDiv">
<a href id="updateLink" class="saveLink">Save</a>
<a href id="cancelLink" class="cancelLink">Cancel</a>
<a href id="createLink" class="saveLink" style="float:left">Create New Announcement</a>
</div>
JS:
$("#updateLink").on("click", function (e) {
e.preventDefault();
if (mode == "edit") {
//This one
updateAnnouncementsData();
}
else if (mode == "create") {
//Ignore this one
createNewAnnouncement();
}
mode = "edit";
});
//Function to retrieve entire result set from backend
function getAnnouncementsData() {
$.ajax({
url: webServiceURL + "getAllAnnouncements",
beforeSend: function (request) {
request.setRequestHeader("Authorization", user.slsPlnrId + '~' + user.role + '~' + user.authId + '~' + AC);
},
type: "POST",
contentType: "application/json; charset=utf-8",
data: JSON.stringify({ "sls_plnr_id": user.slsPlnrId,"role": user.role }),
async: false,
timeout: 30000,
success: function (result, status, xhr) {
if (xhr.status >= 200 && xhr.status < 300 || xhr.status === 304) {
$("#announcementsListDiv").empty();
var x = $(result.announcements).sort("anncmt_dt", "desc");
$.each(x, function (iterator, item) {
var datestr = item.anncmt_dt.split(/[-T.]/);
var dateObj = new Date(datestr.slice(0, 3).join('/') + ' ' + datestr[3]);
var day = dateObj.getDate().toString();
var month = monthNames[dateObj.getMonth()].toString();
var constructor = '<div class="announcementItem" id="' + item.anncmt_id + '">';
constructor += '<div class="dateStampDiv"><span class="dayLabel">' + day + '</span></br><span class="monthLabel">' + month + '</span></div>';
constructor += '<div style="display: none" id="' + item.anncmt_id + 'date">' + item.anncmt_dt + '</div>';
constructor += '<div class="shortAnnouncementDiv">';
constructor += '<div class="shortHeaderDiv" id="' + item.anncmt_id + 'header">' + item.anncmt_sbj + '</div>';
if (item.anncmt_desc.length > 90) {
constructor += '<div class="shortDescDiv">' + item.anncmt_desc.substring(0, 90).trim() + '...' + '</div>';
}
else {
constructor += '<div class="shortDescDiv">' + item.anncmt_desc + '</div>';
}
constructor += '<div style="display: none" id="' + item.anncmt_id + 'description">' + item.anncmt_desc.trim() + '</div>';
constructor += '</div><a href="#" id="a' + item.anncmt_id + '" class="deleteAnnouncement" />';
constructor += '</div>';
$("#announcementsListDiv").append(constructor);
});
$("#announcementsListDiv").append('<div style="clear:both"></div>');
if (x.length == 0) {
mode = "create";
}
//$(".announcementItem").first().trigger("click");
}
},
error: function (xhr, status, error) {
alert("An error occured while processing your request");
}
});
}
//Function to update record at backend
function updateAnnouncementsData() {
var jsonObj = {};
jsonObj.sls_plnr_id = user.slsPlnrId;
jsonObj.role = user.role;
jsonObj.unread_count = "";
jsonObj.announcements = [];
var announcement = {};
var idVal = $(".selectedDivBorder").attr("id");
announcement.anncmt_id = idVal;
if ($("#announcementDisplayHeaderDiv").children().length == 0) {
announcement.anncmt_sbj = $("#announcementDisplayHeaderDiv").text();
}
else {
announcement.anncmt_sbj = $("#announcementDisplayHeaderDiv > form > input").val();
}
if ($("#announcementDisplayDescDiv").children().length == 0) {
announcement.anncmt_desc = $("#announcementDisplayDescDiv").text();
}
else {
announcement.anncmt_desc = $("#announcementDisplayDescDiv > form > textarea").val();
}
if (announcement.anncmt_sbj.trim() == "" || announcement.anncmt_desc.trim() == "") {
alert("Announcement Subject or Description cannot be left blank");
return;
}
var dt = new Date();
announcement.anncmt_dt = dt.getFullYear() + "-" + dt.getMonth() + "-" + dt.getDate();
announcement.anncmt_read_ind = "";
jsonObj.announcements.push(announcement);
$.ajax({
url: webServiceURL + "updateAnnouncements",
beforeSend: function (request) {
request.setRequestHeader("Authorization", user.slsPlnrId + '~' + user.role + '~' + user.authId + '~' + AC);
},
type: "POST",
contentType: "application/json; charset=utf-8",
data: JSON.stringify(jsonObj),
async: false,
success: function (result, status, xhr) {
if (xhr.status >= 200 && xhr.status < 300 || xhr.status === 304) {
if (result.status == "success") {
alert(result.message);
getAnnouncementsData();
//$("#" + idVal).trigger("click");
$("#createLink").css("display", "initial");
}else{
alert(result.message);
}
}
},
error: function (xhr, status, error) {
alert("An error occured while processing your request");
$(".announcementItem").first().trigger("click");
}
});
}
我试图诊断问题作为可能被指向外部URL(在新标签中打开)的链接引起的,但该修复程序无法正常工作。这似乎并非如此,因为在全屏应用程序关闭后,该链接并未在移动Safari中打开。这很重要,我需要快速找到解决方案!我们将不胜感激!
答
我找到了答案。我使用Safari控制台调试器来查看哪些事件被触发。看起来像ng-touch(Angular Touch)引发了这个问题,发射了多个事件以及正在被解雇的常规点击事件。我删除了Angular Touch(它还没有被使用),并且功能开始正常工作。