Question

我使用$("selector").is(":visible")来检查元素的可见性。

然而，当使用模态（bootstrap模态）中的元素时，这只会发生故障。

虽然我找到了一种方法来使用$("selector").css("display")作为临时搭建，但这仍然是一个值得解决的问题。

请检查此jsiddle page以查看有关此问题的更多相关信息。

Answer 1

这是因为执行代码时不会显示模态。有一个动画。这是修改后的代码来证明这一点。您可以使用模态事件来完成您想要的任务：

window.setTimeout(function() {
    console.log(labelError.is(":visible"));
    console.log(labelError.css("display"));
    labelError.show();

    console.log(labelError.css("display"));
    console.log(labelError.is(":visible"));
},500);

请在此处查看修改后的jsfidle页面：https://jsfiddle.net/pbjd2bz6/

Answer 2

自Bootstrap 3.0以来，我们可以使用 on（'shown.bs.modal'，function（e）{

参见JsFiddle https://jsfiddle.net/jn111sum/4/

$( "#generator" ).on('shown.bs.modal', function (e) {
        var labelError=$("#phrasesError");
        $("#phrasesError").fadeOut();
    console.log("this is where the useful infos begin");
    console.log(labelError.is(":visible"));
    console.log(labelError.css("display"));
    labelError.show();
    console.log(labelError.css("display"));
    console.log(labelError.is(":visible"));
});

希望有所帮助

`$（“selector”）。is（“：visible”）`在模态（bootstrap模态）中不起作用

2 个答案: