将变量从一个功能转移到另一个功能

pfrenforyou

我没有弄清楚如何从中访问percEntage变量$("#checkDate").on("click", function();。

var percEntage;

function move() {

    move.called = true; 
    var elem = document.getElementById("checkDate");
    var width = 10;
    var id = setInterval(frame, 10);
    function frame() {
        if (width >= 100) {
            clearInterval(id);
        } else {
            width++;
            elem.style.width = width + '%';
            ==>>percEntage  = document.getElementById("checkDate").innerHTML = width * 1 + '%';
        }
    }   
}

$("#checkDate").on("click", function(){

    var dateObject = $("#arrivalsDate").datepicker('getDate');  
    if(!dateObject){
        $("#arrivalsDate").effect( "shake", {times:4}, 1000 );      
    }else{
        move();
        ==>alert(percEntage);
        if(percEntage=="100%"){
            //do something
        }       
    }
});

大卫

与其他人所写的相反，您不需要在更全局的范围内定义（即足够全局！）或使用window.percEntage。

实际上，没有什么可以阻止$("#checkDate").on("click", ...访问percEntage变量的。

请看下面的代码片段，其中包含您的代码的简化版本：

var percEntage;

function move() {
    var width = 10;
    var id = setInterval(frame, 50);
    function frame() {
        if (width >= 100) {
            clearInterval(id);
        } else {
            width++;
            $( "#checkDate" ).css( "width", width + '%');
            $( "#checkDate" ).html( width + "%" )
            percEntage = $( "#checkDate" ).html();
        }
    }   
}

$("#checkDate").on("click", function(){
    move();
    alert(percEntage);
    if(percEntage=="100%"){
	    alert( "Completed!" );
        //do something more
    }       
});

#checkDate{
    display: block;
    border: 1px solid red;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<button id="checkDate">Check date</button>

第一次单击时收到“未定义”警报的原因checkDate是setInterval尚未开始。从那时起，您将获得正确的百分比。

但是，当然，如果再次单击checkDate该元素，它将返回其原始大小，并且间隔将重新启动（不确定是否是您想要的）。同样，当元素达到100％的宽度时，至少您再次单击它，也不会发生任何事情。

如果您需要在checkDate达到100％时自动发生某些事情，则需要检查间隔内的时间（如JJJ所述）。就像是：

function checkDateCompleted() {
    // do something great here!
}

function frame() {
    if (width >= 100) {
        clearInterval(id);
        checkDateCompleted();
    } else {
        width++;
        elem.style.width = width + '%';
        percEntage  = document.getElementById("checkDate").innerHTML = width * 1 + '%';
    }
}

希望能帮助到你！

本文收集自互联网，转载请注明来源。

如有侵权，请联系 [email protected] 删除。