Anular "Error al cargar página" por fallo de red en el archivo js

Tengo el archivo JQuery Mobile-1.0.js .

// Load a page into the DOM. $.mobile.loadPage = function (url, options) { // This function uses deferred notifications to let callers // know when the page is done loading, or if an error has occurred. var deferred = $.Deferred(), // The default loadPage options with overrides specified by // the caller. settings = $.extend({}, $.mobile.loadPage.defaults, options), // The DOM element for the page after it has been loaded. page = null, // If the reloadPage option is true, and the page is already // in the DOM, dupCachedPage will be set to the page element // so that it can be removed after the new version of the // page is loaded off the network. dupCachedPage = null, // determine the current base url findBaseWithDefault = function () { var closestBase = ($.mobile.activePage && getClosestBaseUrl($.mobile.activePage)); return closestBase || documentBase.hrefNoHash; }, // The absolute version of the URL passed into the function. This // version of the URL may contain dialog/subpage params in it. absUrl = path.makeUrlAbsolute(url, findBaseWithDefault()); // If the caller provided data, and we're using "get" request, // append the data to the URL. if (settings.data && settings.type === "get") { absUrl = path.addSearchParams(absUrl, settings.data); settings.data = undefined; } // If the caller is using a "post" request, reloadPage must be true if (settings.data && settings.type === "post") { settings.reloadPage = true; } // The absolute version of the URL minus any dialog/subpage params. // In otherwords the real URL of the page to be loaded. var fileUrl = path.getFilePath(absUrl), // The version of the Url actually stored in the data-url attribute of // the page. For embedded pages, it is just the id of the page. For pages // within the same domain as the document base, it is the site relative // path. For cross-domain pages (Phone Gap only) the entire absolute Url // used to load the page. dataUrl = path.convertUrlToDataUrl(absUrl); // Make sure we have a pageContainer to work with. settings.pageContainer = settings.pageContainer || $.mobile.pageContainer; // Check to see if the page already exists in the DOM. page = settings.pageContainer.children(":jqmData(url='" + dataUrl + "')"); // If we failed to find the page, check to see if the url is a // reference to an embedded page. If so, it may have been dynamically // injected by a developer, in which case it would be lacking a data-url // attribute and in need of enhancement. if (page.length === 0 && dataUrl && !path.isPath(dataUrl)) { page = settings.pageContainer.children("#" + dataUrl) .attr("data-" + $.mobile.ns + "url", dataUrl); } // If we failed to find a page in the DOM, check the URL to see if it // refers to the first page in the application. If it isn't a reference // to the first page and refers to non-existent embedded page, error out. if (page.length === 0) { if ($.mobile.firstPage && path.isFirstPageUrl(fileUrl)) { // Check to make sure our cached-first-page is actually // in the DOM. Some user deployed apps are pruning the first // page from the DOM for various reasons, we check for this // case here because we don't want a first-page with an id // falling through to the non-existent embedded page error // case. If the first-page is not in the DOM, then we let // things fall through to the ajax loading code below so // that it gets reloaded. if ($.mobile.firstPage.parent().length) { page = $($.mobile.firstPage); } } else if (path.isEmbeddedPage(fileUrl)) { deferred.reject(absUrl, options); return deferred.promise(); } } // Reset base to the default document base. if (base) { base.reset(); } // If the page we are interested in is already in the DOM, // and the caller did not indicate that we should force a // reload of the file, we are done. Otherwise, track the // existing page as a duplicated. if (page.length) { if (!settings.reloadPage) { enhancePage(page, settings.role); deferred.resolve(absUrl, options, page); return deferred.promise(); } dupCachedPage = page; } var mpc = settings.pageContainer, pblEvent = new $.Event("pagebeforeload"), triggerData = { url: url, absUrl: absUrl, dataUrl: dataUrl, deferred: deferred, options: settings }; // Let listeners know we're about to load a page. mpc.trigger(pblEvent, triggerData); // If the default behavior is prevented, stop here! if (pblEvent.isDefaultPrevented()) { return deferred.promise(); } if (settings.showLoadMsg) { // This configurable timeout allows cached pages a brief delay to load without showing a message var loadMsgDelay = setTimeout(function () { $.mobile.showPageLoadingMsg(); }, settings.loadMsgDelay), // Shared logic for clearing timeout and removing message. hideMsg = function () { // Stop message show timer clearTimeout(loadMsgDelay); // Hide loading message $.mobile.hidePageLoadingMsg(); }; } if (!($.mobile.allowCrossDomainPages || path.isSameDomain(documentUrl, absUrl))) { deferred.reject(absUrl, options); } else { // Load the new page. $.ajax({ url: fileUrl, type: settings.type, data: settings.data, dataType: "html", success: function (html, textStatus, xhr) { //pre-parse html to check for a data-url, //use it as the new fileUrl, base path, etc var all = $("<div></div>"), //page title regexp newPageTitle = html.match(/<title[^>]*>([^<]*)/) && RegExp.$1, // TODO handle dialogs again pageElemRegex = new RegExp("(<[^>]+\\bdata-" + $.mobile.ns + "role=[\"']?page[\"']?[^>]*>)"), dataUrlRegex = new RegExp("\\bdata-" + $.mobile.ns + "url=[\"']?([^\"'>]*)[\"']?"); // data-url must be provided for the base tag so resource requests can be directed to the // correct url. loading into a temprorary element makes these requests immediately if (pageElemRegex.test(html) && RegExp.$1 && dataUrlRegex.test(RegExp.$1) && RegExp.$1) { url = fileUrl = path.getFilePath(RegExp.$1); } if (base) { base.set(fileUrl); } //workaround to allow scripts to execute when included in page divs all.get(0).innerHTML = html; page = all.find(":jqmData(role='page'), :jqmData(role='dialog')").first(); //if page elem couldn't be found, create one and insert the body element's contents if (!page.length) { page = $("<div data-" + $.mobile.ns + "role='page'>" + html.split(/<\/?body[^>]*>/gmi)[1] + "</div>"); } if (newPageTitle && !page.jqmData("title")) { if (~newPageTitle.indexOf("&")) { newPageTitle = $("<div>" + newPageTitle + "</div>").text(); } page.jqmData("title", newPageTitle); } //rewrite src and href attrs to use a base url if (!$.support.dynamicBaseTag) { var newPath = path.get(fileUrl); page.find("[src], link[href], a[rel='external'], :jqmData(ajax='false'), a[target]").each(function () { var thisAttr = $(this).is('[href]') ? 'href' : $(this).is('[src]') ? 'src' : 'action', thisUrl = $(this).attr(thisAttr); // XXX_jblas: We need to fix this so that it removes the document // base URL, and then prepends with the new page URL. //if full path exists and is same, chop it - helps IE out thisUrl = thisUrl.replace(location.protocol + '//' + location.host + location.pathname, ''); if (!/^(\w+:|#|\/)/.test(thisUrl)) { $(this).attr(thisAttr, newPath + thisUrl); } }); } //append to page and enhance // TODO taging a page with external to make sure that embedded pages aren't removed // by the various page handling code is bad. Having page handling code in many // places is bad. Solutions post 1.0 page .attr("data-" + $.mobile.ns + "url", path.convertUrlToDataUrl(fileUrl)) .attr("data-" + $.mobile.ns + "external-page", true) .appendTo(settings.pageContainer); // wait for page creation to leverage options defined on widget page.one('pagecreate', $.mobile._bindPageRemove); enhancePage(page, settings.role); // Enhancing the page may result in new dialogs/sub pages being inserted // into the DOM. If the original absUrl refers to a sub-page, that is the // real page we are interested in. if (absUrl.indexOf("&" + $.mobile.subPageUrlKey) > -1) { page = settings.pageContainer.children(":jqmData(url='" + dataUrl + "')"); } //bind pageHide to removePage after it's hidden, if the page options specify to do so // Remove loading message. if (settings.showLoadMsg) { hideMsg(); } // Add the page reference and xhr to our triggerData. triggerData.xhr = xhr; triggerData.textStatus = textStatus; triggerData.page = page; // Let listeners know the page loaded successfully. settings.pageContainer.trigger("pageload", triggerData); deferred.resolve(absUrl, options, page, dupCachedPage); }, error: function (xhr, textStatus, errorThrown) { //set base back to current path if (base) { base.set(path.get()); } // Add error info to our triggerData. triggerData.xhr = xhr; triggerData.textStatus = textStatus; triggerData.errorThrown = errorThrown; var plfEvent = new $.Event("pageloadfailed"); // Let listeners know the page load failed. settings.pageContainer.trigger(plfEvent, triggerData); // If the default behavior is prevented, stop here! // Note that it is the responsibility of the listener/handler // that called preventDefault(), to resolve/reject the // deferred object within the triggerData. if (plfEvent.isDefaultPrevented()) { return; } // Remove loading message. if (settings.showLoadMsg) { // Remove loading message. hideMsg(); //show error message $("<div class='ui-loader ui-overlay-shadow ui-body-e ui-corner-all'><h1>" + $.mobile.pageLoadErrorMessage + "</h1></div>") .css({ "display": "block", "opacity": 0.96, "top": $window.scrollTop() + 100 }) .appendTo(settings.pageContainer) .delay(800) .fadeOut(400, function () { $(this).remove(); }); } deferred.reject(absUrl, options); } }); } return deferred.promise(); }; 

Este es el código para mostrar un mensaje de error "Error Loading Page" para el error en la página. Aquí quiero mostrar mensaje de alerta para el error de conexión de red como "Please check your net connection" lugar de la imagen de abajo.

Error al cargar la página

Nota: No quiero cambiar el pageloaderrormessage. Desea parar para obtener los mensajes de error de página, en lugar de que voy a permitir mi condición de error de red como en Mostrar Error de red en android . Si el usuario presiona "Ok" en el cuadro de diálogo de alerta, los navegaré a Reload.html.

¿Dígame por favor dónde puedo comprobar esa condición y donde tengo que cambiar el mensaje de error?

3 Solutions collect form web for “Anular "Error al cargar página" por fallo de red en el archivo js”

Como tanto @shkschneider y @codemonkey han sugerido que usted necesita para establecer esta opción en mobileinit

Ejemplo:

 $(document).bind("mobileinit", function(){ $.mobile.pageLoadErrorMessage = "Please check your net connection"; }); 

Vincular los documentos de jQM 1.0.1:

He aquí un ejemplo:

Ahora si usted tiene la capacidad de actualizar jQM a 1.1.1 puede intentar algo como esto:

 //use theme swatch "b", a custom message, and no spinner $.mobile.showPageLoadingMsg("b", "Please check your net connection", true); // hide after delay setTimeout( $.mobile.hidePageLoadingMsg, 1500 ); 

Docs:

ACTUALIZAR:

Otro pensamiento es utilizar un complemento para lograr algo como usted quiere, ¿Algo así funciona?

Simplemente utilice:

 $(document).bind("mobileinit", function(){ $.mobile.pageLoadErrorMessage("Please check your netconnection"); }); 

http://jquerymobile.com/test/docs/api/globalconfig.html

Establezca pageLoadErrorMessage como se describe aquí http://jquerymobile.com/demos/1.1.1/docs/api/globalconfig.html

EDITAR

Si desea manejar el comportamiento de forma personalizada, configure loadingMessage como false. Esto evita que se muestre el mensaje de carga. Puede vincular a pageloadfailed (descrito aquí http://jquerymobile.com/demos/1.1.1/docs/api/events.html ) y agregar añadir su lógica de manejo personalizado en el controlador de eventos.

  • Cómo deshabilitar el botón de retroceso del teléfono en Android con Jquerymobile, PhoneGap
  • Los iconos de jQuery Mobile son blancos en lugar de negro en Android
  • Ejecutar aplicación Android phonegap en segundo plano
  • Phonegap, jQueryMobile y servicio web
  • Error "La conexión con el servidor no tuvo éxito." En Cordova y jQuery
  • JSfiddle: cómo crear proyectos multi-JS / CSS / HTML proyecto?
  • Jquery móvil - keydown keydown en dispositivos móviles
  • Selector de fecha y hora que no se muestra en la aplicación Android 4.1.2
  • Recorta la imagen de la cámara antes de subirla (Phonegap)
  • ¿Por qué jQuery Mobile 1.1-rc1 utiliza un .gif para el icono de carga (de nuevo)?
  • Deslice con jQuery Mobile 1.2, PhoneGap 2.1 y Android 4.0.4 no funcionan correctamente
  • FlipAndroid es un fan de Google para Android, Todo sobre Android Phones, Android Wear, Android Dev y Aplicaciones para Android Aplicaciones.