Help - Search - Members - Calendar
Full Version: JavaScript On Click Runs On Page Load
HTMLHelp Forums > Programming > Client-side Scripting
FrostTaco
Hi guys, so I have some code which runs not only on click, but also on page load, which it really should not do. Here is the code
CODE
<script>
                    document.getElementById('crefer').onclick = function() {
                        var rlink = prompt("Your referal link is http://corndog.corticalcafe.com/?", "ABCYXZ");
                        if(rlink != null){
                            <?php
                                $steam64 = str_replace("http://steamcommunity.com/openid/id", "", $_SESSION['FrostyTaco']);
                                $_SESSION['steam_name'] = $content['response']['players'][0]['personaname'];
                                $name = $_SESSION['steam_name'];
                                $referbuffer = fopen("cache/refer.json", "w+");
                                $rlink = "";
                                $arr = array("$name" => "$rlink");
                                fwrite($referbuffer, json_encode($arr));
                                fclose($referbuffer);
                            ?>
                        }
                    }
                </script>
Christian J
That shouldn't happen in the code example. Could you post a complete (but minimal) test page?
Christian J
The test page should not contain any raw PHP code, only the rendered content.
FrostTaco
QUOTE(Christian J @ May 7 2016, 12:27 PM) *

The test page should not contain any raw PHP code, only the rendered content.

So you mean I take the source from "page source" and put that as the test page?
pandy

Yeah, View Source, so you get the rendered output if you are going to paste it in here. If you link to the live page PHP is fine.
FrostTaco
QUOTE(pandy @ May 7 2016, 10:59 PM) *

Yeah, View Source, so you get the rendered output if you are going to paste it in here. If you link to the live page PHP is fine.

Sadly, the way its setup, unless you wanna change the code, you have to login through steam to view the page, but heres the rendered output:
CODE

<!doctype html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>FrostyCSGO</title>
    <link rel="stylesheet" href="css/style.css" type="text/css">
    <link rel="stylesheet" type="text/css" href="css/mobile.css">
    <script src="js/mobile.js" type="text/javascript"></script>
    <style type="text/css">
    .zoomin input {
        border-radius: 10px;
        border: 2px solid gray;
        height: 100px;
        width: 100px;
        -webkit-transition: all 1s ease;
        -moz-transition: all 1s ease;
        -ms-transition: all 1s ease;
        transition: all 1s ease;
    } .zoomin input:hover { width: 150px; height: 150px; }
    .zoomin {
        height: 120px;
        display: inline;
    }

    .bhtml {
        border-radius: 10px;
        border: 2px solid gray;
        color: red;
        background-color: orange;
        width: 10%;
    }

    .rpic {
        border-radius: 17px;
        border: 2px solid gray;
    }

    </style>
</head>
<body>
    <div id="page">
        <div id="header">
            <div>
                <a href="index.php" class="logo"><img src="images/frosty/frostycsgo.png" alt=""></a>
                <ul id="navigation">
                    <li>
                        <a href="index.php">Home</a>
                    </li>
                    <li>
                        <a href="contact.php">Contact</a>
                    </li>
                    <a href='http://steamcommunity.com/id/FrostTaco/'><img src='https://steamcdn-a.akamaihd.net/steamcommunity/public/images/avatars/81/81559b38e6592c6fe06d6d9a15a20e6225332a2c_medium.jpg' class='rpic'></a><a href='MyAccount.php' class='bhtml'>FrostTaco3</a><div id="login"><a href="?logout">Logout</a></div>                </ul>
            </div>
        </div>
        <div id="body" class="home">
            <div class="header" align="center">
                <p class='bhtml' id='cemail'>♠Change/Edit Email♠: </p><p>sup</p><p class='bhtml' id='ctrade'>♠Change/Edit TradeLink♠: <a href='http://steamcommunity.com/id/show/tradeoffers/privacy' target='_blank'>(Find your TradeLink Here)</a>:</p><p></p><p class='bhtml' id='crefer'>♠Refer A Friend(IN TESTING)♠: </p> <p></p>                <script>
                    document.getElementById('crefer').onclick = function() {
                        var rlink = prompt("Your referal link is http://corndog.corticalcafe.com/?", "ABCYXZ");
                        if(rlink != null){
                                                    }
                    }
                </script>
            </div>
            <div class="body">
                <div align="center"><p>Site owned by FrostTaco3</p></div>
            </div>
            <div class="footer">
                <br />
                <br />
                <br />
                <br />
                <br />
                <br />
            </div>
        </div>
        <div id="footer">
            <div align="center">
                <p>FrostyCS:GO</p>
                <a href="http://steampowered.com">Powered by Steam</a>
            </div>
        </div>
    </div>
</body>
</html>
pandy
Doesn't run on page load.
Christian J
There's another script at js/mobile.js that may or may not interfere.
FrostTaco
QUOTE(Christian J @ May 8 2016, 09:20 PM) *

There's another script at js/mobile.js that may or may not interfere.


CODE
window.onload = function(){
    var getNavi = document.getElementById('navigation');

    var mobile = document.createElement("span");
    mobile.setAttribute("id","mobile-navigation");
    getNavi.parentNode.insertBefore(mobile,getNavi);

    document.getElementById('mobile-navigation').onclick = function(){
        var a = getNavi.getAttribute('style');
        if(a){
            getNavi.removeAttribute('style');
            document.getElementById('mobile-navigation').style.backgroundImage='url(images/mobile/mobile-menu.png)';
        } else {
            getNavi.style.display='block';
            document.getElementById('mobile-navigation').style.backgroundImage='url(images/mobile/mobile-close.png)';
        }
    };
    var getElm = getNavi.getElementsByTagName("LI");
    for(var i=0;i<getElm.length;i++){
        if(getElm[i].children.length>1){
            var smenu = document.createElement("span");
            smenu.setAttribute("class","mobile-submenu");
            smenu.setAttribute("OnClick","submenu("+i+")");
            getElm[i].appendChild(smenu);
        };
    };
    submenu = function (i){
        var sub = getElm[i].children[1];
        var b = sub.getAttribute('style');
        if(b){
            sub.removeAttribute('style');
            getElm[i].lastChild.style.backgroundImage='url(images/mobile/mobile-expand.png)';
            getElm[i].lastChild.style.backgroundColor='rgba(121, 101, 102, 0.91)';
        } else {
            sub.style.display='block';
            getElm[i].lastChild.style.backgroundImage='url(images/mobile/mobile-collapse.png)';
            getElm[i].lastChild.style.backgroundColor='rgba(204, 60, 104, 0.91)';
        }
    };
};


Runs on page load for me?(Using chrome)
Christian J
QUOTE(FrostTaco @ May 9 2016, 11:00 PM) *

Runs on page load for me?(Using chrome)

Yes that script alone should run, due to its onload event.

What exactly does happen on page load that you don't want? Does the prompt box open? That shouldn't happen, not even with the mobile.js script.
FrostTaco
QUOTE(Christian J @ May 9 2016, 08:16 PM) *

QUOTE(FrostTaco @ May 9 2016, 11:00 PM) *

Runs on page load for me?(Using chrome)

Yes that script alone should run, due to its onload event.

What exactly does happen on page load that you don't want? Does the prompt box open? That shouldn't happen, not even with the mobile.js script.

The prompt does not open, however the file refer.json is created with the text: {"FrostTaco3":""}
Christian J
PHP runs on the server, before any javascript is run in the browser (I didn't pay attention to this before, sorry). So you can't use javascript to determine if PHP code in it should run, because when the browser sees the javascript the server has already run the PHP code (and the PHP engine on the server ignores javascript).

So this is not a javascript issue after all, back to http://forums.htmlhelp.com/index.php?showtopic=43902 happy.gif
This is a "lo-fi" version of our main content. To view the full version with more information, formatting and images, please click here.
Invision Power Board © 2001-2024 Invision Power Services, Inc.