仅在第一页加载时运行Javascript

时间:2016-07-02 10:57:58

标签: javascript asp.net

我希望此代码仅在第一次加载页面时起作用。

无论如何在javascript上使用IsPostBack

IsPostBack:获取一个值,该值指示页面是第一次呈现还是正在加载以响应回发。 More here

<script>  

window.onload = function TimedCss()
{

    setTimeout(myTimeout1, 0500) 
    setTimeout(myTimeout2, 1000) 
    setTimeout(myTimeout3, 1500)
    setTimeout(myTimeout4, 2000) 
    setTimeout(myTimeout5, 2500)
    setTimeout(myTimeout6, 3000)
}



}
function myTimeout1() 
{
    document.getElementById("LBLName").className = " animated fadeInLeft";
    document.getElementById("LBLName").style.visibility = "visible";
}
function myTimeout2() 
{ 
    document.getElementById("LBLDescription").className = " animated rotateIn";
    document.getElementById("LBLDescription").style.visibility = "visible"; 
}
function myTimeout3() 
{
    document.getElementById("P1").className = " animated zoomIn";
    document.getElementById("P1").style.visibility = "visible";
}
function myTimeout4()
{
    document.getElementById("TXTQuantity").className = " animated flipInY";
    document.getElementById("TXTQuantity").style.visibility = "visible";
}
function myTimeout5()
{
    document.getElementById("LBLPrice").className = " animated slideInLeft";
    document.getElementById("LBLPrice").style.visibility = "visible";
}
function myTimeout6()
{
    document.getElementById("BTNAddToCart").className += " animated fadeInUp";
    document.getElementById("BTNAddToCart").style.visibility = "visible";
}

</script> 

编辑 - 解决方案:

<script>
window.onload = function TimedCSS()
{
    var isPostBack=<%= IsPostBack ? "true" : "false" %>

    if (!isPostBack)
    {
        setTimeout(myTimeout1, 0500) 
        setTimeout(myTimeout2, 1000) 
        setTimeout(myTimeout3, 1500)
        setTimeout(myTimeout4, 2000) 
        setTimeout(myTimeout5, 2500)
        setTimeout(myTimeout6, 3000)
    }




function myTimeout1() 
{
    document.getElementById("LBLName").className = " animated fadeInLeft";
    document.getElementById("LBLName").style.visibility = "visible";
}
function myTimeout2() 
{ 
    document.getElementById("LBLDescription").className = " animated rotateIn";
    document.getElementById("LBLDescription").style.visibility = "visible"; 
}
function myTimeout3() 
{
    document.getElementById("P1").className = " animated zoomIn";
    document.getElementById("P1").style.visibility = "visible";
}
function myTimeout4()
{
    document.getElementById("TXTQuantity").className = " animated flipInY";
    document.getElementById("TXTQuantity").style.visibility = "visible";
}
function myTimeout5()
{
    document.getElementById("LBLPrice").className = " animated slideInLeft";
    document.getElementById("LBLPrice").style.visibility = "visible";
}
function myTimeout6()
{
    document.getElementById("BTNAddToCart").className += " animated fadeInUp";
    document.getElementById("BTNAddToCart").style.visibility = "visible";
}

</script>

2 个答案:

答案 0 :(得分:1)

在第一页加载时将变量存储在Cookie中,并每次检查变量的值。

有关Cookie的使用,请参阅this

<强> [增订]

由于Cookie的demo,我为sourceorigin-same policy创建了一个html。

我将源代码复制为以下代码进行备份。您必须在自己的源上执行以下代码,因为之前提到的 origin-same 策略。

<!DOCTYPE>
<html>
    <head>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
    </head>
    <body>
        <div id="pageLoadStatus"></div>
        <script>
            var _ = {};
            /**
             * Gets or sets cookies
             * @param name
             * @param value (null to delete or undefined to get)
             * @param options (domain, expire (in days))
             * @return value or true
             */
            _.cookie = function(name, value, options)
            {
                if (typeof value === "undefined") {
                    var n, v,
                        cookies = document.cookie.split(";");
                    for (var i = 0; i < cookies.length; i++) {
                        n = $.trim(cookies[i].substr(0,cookies[i].indexOf("=")));
                        v = cookies[i].substr(cookies[i].indexOf("=")+1);
                        if (n === name){
                            return unescape(v);
                        }
                    }
                } else {
                    options = options || {};
                    if (!value) {
                        value = "";
                        options.expires = -365;
                    } else {
                        value = escape(value);
                    }
                    if (options.expires) {
                        var d = new Date();
                        d.setDate(d.getDate() + options.expires);
                        value += "; expires=" + d.toUTCString();
                    }
                    if (options.domain) {
                        value += "; domain=" + options.domain;
                    }
                    if (options.path) {
                        value += "; path=" + options.path;
                    }
                    document.cookie = name + "=" + value;
                }
            };

            var hasLoadedBefore = _.cookie('hasLoadedBefore');
            if(!!hasLoadedBefore) $('#pageLoadStatus').text('This page has been loaded before.');
            else $('#pageLoadStatus').text('This page loaded at first time.');
            _.cookie('hasLoadedBefore', true);
        </script>
    </body>
</html>

答案 1 :(得分:0)

请注意,您无法100%确定您的脚本仅在首次加载时运行。

如果你真的想要“保护”它,你可以尝试在session,cookies和localStorage中存储数据。