JavaScript error function not defined - CSS-Tricks

This topic is empty.

Viewing 4 posts - 1 through 4 (of 4 total)

Author

Posts

September 24, 2016 at 1:25 pm #245884

Participant

I have this code:

&lt;html&gt;
&lt;head&gt;
    &lt;title&gt;Messenger&lt;/title&gt;
&lt;/head&gt;
&lt;body onload="checkcookie(); update();"&gt;

<div></div>

<div>
&lt;h1&gt;Pick a username:&lt;/h1&gt;
&lt;input type="text" name="pickusername" id="cusername" placeholder="Pick a username" class="msginput"&gt;
&lt;button onclick="chooseusername()"&gt;Choose Username&lt;/button&gt;
</div>

<div>
    <div>Messenger</div>
    <div></div>
    <div>&lt;input type="text" name="msginput" class="msginput" id="msginput" onkeydown="if (event.keyCode == 13) sendmsg()" value="" placeholder="Enter your message here ... (Press enter to send message)"&gt;</div>
</div>

&lt;script type="text/javascript"&gt;

var msginput = document.getElementById("msginput");

function showLogin() {
    document.getElementById("whitebg").style.display = "inline-block";
    document.getElementById("loginbox").style.display = "inline-block";
  }

`function hideLogin() {
document.getElementById("whitebg").style.display = "none";
document.getElementById("loginbox").style.display = "none";
`

}

function chooseusername() {
    var user = document.getElementById("cusername").value;
    document.cookie = "messengerUname" + user;
    checkcookie();
  }

function checkcookie() {
    if(document.cookie.indexOf("messageUname") == -1) {
      showLogin();
    } else {
      hideLogin();
    }
  }

function getcookie(cname) {
    var name = cname + "=";
    var ca = document.cookie.split(';');
    for(var i=0; i&lt;ca.length; i++) {
        var c = ca[i];
        while (c.charAt(0)==' ') c = c.substring(1);
        if (c.indexOf(name) == 0) return c.substring(name.length,c.length);
    }
    return "";
  }

function sendmsg() {
    var message = msginput.value;
    if(message != "") {

`  var username = getcookie("messengerUname");

  var xmlhttp = new XMLHttpRequest();

  xmlhttp.onreadystatechange = function() {
    if(xmlhttp.readyState == 4 &amp;&amp; xmlhttp.status == 200){
      console.log(xmlhttp.responseText);
            }
  }

    xmlhttp.open("GET","update-messages.php?username="+username+"&amp;message="+message, true);
    xmlhttp.send();
    }
}
`

&lt;/script&gt;
&lt;/body&gt;
&lt;/html&gt;

Here is the site

I am using 000webhost to host it. The problem is that when I type in sendmsg() in the console, it says that sendmsg isn’t defined.

September 28, 2016 at 10:27 pm #245992

Redfredg

Participant

Frankly, hoisting should’ve been removed so “var” works correctly, and there would never be a need for “let” (which is a rubbish word and feels like 80s BASIC programming on the ZX Spectrum). It seems ridiculous to just introduce a new declaration that works properly, yet keeping the old one in. Would’ve been backwards compatible too. I can understand your point of view and it’d be quite cleaner. But it wouldn’t be backwards compatible due to the facts named below but also because even if you should declare variables within the corresponding scope, there’s never a guarantee that they really are. Changing the hoisting behavior would crash millions of websites and that’s not acceptable. But it’d have been possible to just allow coders to define something like “use-strict” for the ECMAScript version they’re using in their scripts. That would be backwards compatible since authors would expect var to act like let when they define ECMAScript 6 in their scripts.

Thanks !!
Refred@ redgage

September 28, 2016 at 11:40 pm #245993