jQuery Mobile 加载消息

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/10397940/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-26 09:14:24  来源:igfitidea点击:

jQuery Mobile loading message

jqueryjquery-mobilemobile

提问by MikkoP

When I linked jQuery Mobile to my page, some sort of loading message appeard in the bottom of the page and I can't get a rid of it. I've tried $.mobile.pageLoading(true) but it didn't work.

当我将 jQuery Mobile 链接到我的页面时,页面底部出现了某种加载消息,我无法摆脱它。我试过 $.mobile.pageLoading(true) 但没有用。

How should I remove it? I haven't printed it anywhere.

我应该如何删除它?我没有在任何地方打印它。

回答by veeTrain

The 1.4 loader documentation

1.4 加载器文档

The 1.4 documentation suggests interaction with the Loaderwidget. The top of the page describes globally changing the option but it can be nuanced on a link-by-link basis. This may also work:

1.4 文档建议与Loader小部件交互。页面顶部描述了全局更改选项,但可以在逐个链接的基础上进行细微调整。这也可能有效:

$( document ).on( "mobileinit", function() {
    $.mobile.loader.prototype.options.disabled = true;
});

Also, according to http://demos.jquerymobile.com/1.4.5/loader/and http://api.jquerymobile.com/loader/, you can hide the loading experience with the following code:

此外,根据http://demos.jquerymobile.com/1.4.5/loader/http://api.jquerymobile.com/loader/,您可以使用以下代码隐藏加载体验:

// As submitted by @Aras
$.mobile.loading( "hide" );
// (or presumably as submitted by @Pnct)
$.mobile.loading().hide();

Option B - disable AJAX loading

选项 B - 禁用 AJAX 加载

Disabling AJAX loading will effectively remove the message.

禁用 AJAX 加载将有效地删除消息。

If you don't want a page to benefit from loading in the background and then showing, you can make it load like 'normal' by specifying the data-ajax='false'on whatever anchor (<a...>) tag you don't want to see a loading message for. There's also a global setting you can use to make all links load 'normally'.

如果您不希望页面受益于在后台加载然后显示,您可以通过data-ajax='false'<a...>您不想看到加载消息的任何锚 ( ) 标签上指定 ,使其像“正常”一样加载。还有一个全局设置可用于使所有链接“正常”加载。

To disable globally (be sure to read this pageto understand implications and their recommendations. The new docsmay not have warnings):

全局禁用(请务必阅读此页面以了解含义及其建议。新文档可能没有警告):

$.mobile.ajaxEnabled=false;

Option C - just hide it

选项 C - 隐藏它

If you want to use the 1.4 Load Pageapproach to load external pages, it has an option available for showLoadMsgwhich you can simply set to false.

如果您想使用 1.4加载页面方法加载外部页面,它有一个可用选项showLoadMsg,您可以简单地将其设置为 false。

The global option (available in earlier versions -- at least 1.0, 1.1, and 1.2 -- read about it here) for just removing the message is:

用于删除消息的全局选项(在早期版本中可用——至少 1.0、1.1 和 1.2——在此处阅读)是:

$.mobile.loadingMessage = false;

The 1.2 and prior documentation says that if you set it to false, no loading message will be shown.

1.2 和之前的文档说,如果将其设置为 false,则不会显示加载消息。

回答by Aras

I am using the latest version of JQuery Mobile (currently 1.4) and run into this problem. None of the solutions here worked for me and I think many of them have been deprecated. Here is what worked for me:

我正在使用最新版本的 JQuery Mobile(当前为 1.4)并遇到了这个问题。这里没有一个解决方案对我有用,我认为其中许多已被弃用。这是对我有用的:

$.mobile.loading().hide();

$.mobile.loading()will give you the element and you can hideit or do whatever else you wish. Hope this helps someone.

$.mobile.loading()会给你元素,你可以hide它或做任何你想做的事情。希望这可以帮助某人。

回答by Pnct

If you are using the latest update (1.2.0) of jquerymobile try this

如果您使用的是 jquerymobile 的最新更新 (1.2.0),请尝试此操作

$.mobile.loading( 'show', { theme: "b", text: "", textonly: false});

since it worked for me.

因为它对我有用。

回答by Dani

I had the same problem, an annoying loading message and an orange frame. It was due to not adding the reference to the jquery style sheet.

我遇到了同样的问题,一个烦人的加载消息和一个橙色的框架。这是由于没有添加对 jquery 样式表的引用。

Adding the reference in the header solved it.

在标题中添加引用解决了它。

<link rel="stylesheet" type="text/css" href="https://code.jquery.com/mobile/1.4.0/jquery.mobile-1.4.0.min.css">

回答by Ryan Skoblenick

Pnct's answer is closer to correct for JQM 1.2.0. However, the below would be more correct per the API document provided.

Pnct 的答案更接近于 JQM 1.2.0 的正确答案。但是,根据提供的 API 文档,以下内容会更正确。

$.mobile.loading('hide');

Also ensure you have the stylesheet defined for the JQM structure at minimum in your HTML file. Otherwise it will look like the function does nothing.

还要确保在 HTML 文件中至少为 JQM 结构定义了样式表。否则看起来该函数什么都不做。

回答by sonxurxo

In my case (jQueryMobile 1.4.5) I just had to add this to my CSS, and this way I can avoid importing the whole jQueryMobile CSS file (I don't need it).

在我的情况 ( jQueryMobile 1.4.5) 中,我只需要将它添加到我的 CSS 中,这样我就可以避免导入整个 jQueryMobile CSS 文件(我不需要它)。

.ui-loader {
  display: none !important;
}

回答by Kelvin

By default, that message should be hidden. It is likely that you have not included the official jQuery Mobile stylesheet.

默认情况下,该消息应该是隐藏的。您可能没有包含官方的 jQuery Mobile 样式表。

You shouldn't manually hide or disable the loading message through code.

您不应通过代码手动隐藏或禁用加载消息。

The correct method should be to included the following stylesheet for jQuery Mobile 1.4.5:

正确的方法应该是为 jQuery Mobile 1.4.5 包含以下样式表:

<link rel="stylesheet" type="text/css" href="http://code.jquery.com/mobile/1.4.5/jquery.mobile.structure-1.4.5.css">

This will solve various issues including blue outlines around selected elements in Chrome and orange outlines in Android.

这将解决各种问题,包括 Chrome 中选定元素周围的蓝色轮廓和 Android 中的橙色轮廓。

In case this post gets outdated, the stylesheets for all versions can be found over here: https://jquerymobile.com/download/

如果这篇文章过时了,可以在这里找到所有版本的样式表:https: //jquerymobile.com/download/

回答by antonio

Add this

添加这个

<script>
$(document).ready(function(){
  $(".ui-loader").hide();
});
</script>

回答by montie

You can also use smth. like that to remove the message:

您也可以使用 smth。像这样删除消息:

$('.ui-loader h1').remove();

回答by Zeni

In my case I was loading wrong css file (jquery css instead of jquery mobile css)

就我而言,我加载了错误的 css 文件(jquery css 而不是 jquery mobile css)

Wrong:

错误的:

<link href="../CSS/jquery-ui-1.11.4.custom/jquery-ui.min.css" rel="stylesheet" />

Right:

对:

<link href="../CSS/jquery.mobile-1.4.5.min.css" rel="stylesheet" />