jquery - 为什么 JQuery .hide() 函数不能与引导微调器一起使用？

Question

当我的服务器回答 ajax 查询时，我正在做一个简单的旋转器反馈。我调用 JQuery .show()在进行 ajax 调用之前执行函数并获得 .hide()在 .always() 中调用的函数请求的回调。

但我的微调器从不隐藏!我不明白为什么...有人使用 .hide() 遇到过这个问题吗？带有 Bootstrap 微调器的 JQuery 函数？

有关 .getJSON() 的更多信息here , 关于 .hide() 的更多信息和 .show() here .

这是我的 html 微调器，它来自 here

<div id="spinner-map-right-click" class="d-flex justify-content-center">
    <div class="spinner-border" role="status">
        <span class="sr-only">Loading...</span>
    </div>
</div>

这是我的 javascript :

$('#spinner-map-right-click').show()
$.getJSON({ url: "myurl" })
    .done(function(data) {
        // does stuff here and it works
    })
    .fail(function(data) {
        // display error message if there is an error
    })
    .always(function(data) {
        console.log("Hiding")
        // the console log displays but my spinner is always ther :(
        $('#spinner-map-right-click').hide()
    });

请求有效，我正确获取数据并且 "Hiding"显示正确，因此 always()回调被正确调用，当我检查来自 Firefix 的代码时，我看到了 <div>已正确修改:

<div id="spinner-map-right-click" class="d-flex justify-content-center" style="display: none;">
    <div class="spinner-border" role="status">
        <span class="sr-only">Loading...</span>
    </div>
</div>

Answer 1

这是因为 d-flex 类。你可以试试

$('#spinner-map-right-click').addClass('d-none') // removeClass('d-none')

d-flex 通过引导使用 !important覆盖 inline 样式

的异常