如何隐藏 Font Awesome 微调器？

Question

我在 MVC .net Razor 页面上有以下微调器：

 <div id="spinner1">Processing Video... <i class="fa fa-spinner fa-spin fa-2x fa-fw"></i></div>

它工作正常。我有一个 Signal-R 推送来向页面添加数据（工作正常）。一旦数据列表完成（工作正常），我想隐藏 sipnner。

我试过：

$('#spinner1').display = 'none';

但是没有任何反应，旋转器还在旋转。我怎样才能摆脱它？

Answer 1

根据问题中的代码假设您正在使用 jQuery，jQuery 对象没有 display 属性。相反，你会使用 hide:

$("#spinner1").hide();

...尽管您可以直接使用display，通过css函数或从内部访问原始DOM元素jQuery 包装器：

$("#spinner1").css("display", "none");      // Using `css`
$("#spinner1")[0].style.display = "none";   // Accessing raw DOM element

鉴于您已经将 # 包含在 $("#spinner1") 中，我认为这不太可能，但是：如果您使用的是 MooTools 或 PrototypeJS 或其他具有 $ 函数但是 returns 原始 DOM 元素，display 属性在 style:

上

// NOT JQUERY
$("spinner1").style.display = "none";

请注意，在这两种情况下，您不会将 # 包含在 $() 中（尽管您会在 $$() 中包含）。

Answer 2

我正在使用此代码：

<i id="spin" class="fa fa-circle-o-notch fa-spin"></i>

在 js 中：

$("#spin").hide();

对我来说效果很好。

How do I hide a Font Awesome spinner?