Question

我在blockUI中的块之间进行转换，但是在解除阻塞之后它会完全从DOM中删除第一个项目的元素，有没有办法解决这个问题？

$(function () {
    $("#step1").click(function() {
        $.blockUI({ message: $("#test1") });
    });
    
	$("#step2").click(function() {
        $.unblockUI();
        $.blockUI({ message: $("#test2") });
    });
    
	$("#step3").click(function() {
        $.unblockUI();
    });
    
	$("#step4").click(function() {
        if ($("#test1").length > 0)
            $.blockUI({ message: "test 1 still exists in DOM" });
        else
            $.blockUI({ message: "cannot find test 1 in DOM" });
    });      
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/jquery-ui.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.blockUI/2.66.0-2013.10.09/jquery.blockUI.min.js"></script>
<input type="button" id="step1" value="1. Show first block" />
<div id="test1">test 1<br />
    <input type="button" id="step2" value="2. Switch to second block" /></div>
<div id="test2">test 2<br />
    <input type="button" id="step3" value="3. Hide all blocks" /></div>
<input type="button" id="step4" value="4. See if test1 exists" />

Answer 1

我发现问题与淡出有关，如果你愿意，可以随意删除这个问题。

＆＃13;

$(function () {
    $("#step1").click(function() {
        $.blockUI({ message: $("#test1") });
    });
    
	$("#step2").click(function() {
        $.unblockUI({ fadeOut: 0});
        $.blockUI({ message: $("#test2") });
    });
    
	$("#step3").click(function() {
        $.unblockUI();
    });
    
	$("#step4").click(function() {
        if ($("#test1").length > 0)
            $.blockUI({ message: "test 1 still exists in DOM" });
        else
            $.blockUI({ message: "cannot find test 1 in DOM" });
    });      
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/jquery-ui.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.blockUI/2.66.0-2013.10.09/jquery.blockUI.min.js"></script>
<input type="button" id="step1" value="1. Show first block" />
<div id="test1">test 1<br />
    <input type="button" id="step2" value="2. Switch to second block" /></div>
<div id="test2">test 2<br />
    <input type="button" id="step3" value="3. Hide all blocks" /></div>
<input type="button" id="step4" value="4. See if test1 exists" />

＆＃13;

块之间的转换正在失去元素

1 个答案: