Created
June 10, 2014 05:15
-
-
Save mayfer/62d352de1b777d909717 to your computer and use it in GitHub Desktop.
Intro to JS
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<html> | |
<head> | |
<!-- we need to load jquery before we use it --> | |
<script type="text/javascript" src="http://code.jquery.com/jquery-1.11.1.min.js"></script> | |
<script> | |
// this code must run when the document is fully loaded | |
// otherwise we will try to bind events on elements that don't exist yet (html and code is parsed top to bottom) | |
$(document).ready( function () { | |
// the document object has a bunch of methods that lets us select elements | |
// elements are subsets of the document and have methods themselves | |
var button = document.getElementsByClassName("clickable")[0]; | |
var input = document.getElementsByName("money")[0]; | |
// for example, they have the addEventListener method. | |
// the browser has a bunch of default event types it fires, such as click. | |
// you can also use your own custom events that you fire and listen for. they are represented by strings. | |
button.addEventListener("click", function(){ | |
// input elements, when fetched from the dom, have a property valled "value" that you can set and get. | |
if(parseInt(input.value) < 1000) { | |
alert('dude get a job'); | |
} else { | |
alert('ya yer rich'); | |
} | |
input.value = ''; | |
}); | |
}); | |
</script> | |
</head> | |
<body> | |
How much money do you have? $<input type="text" name="money" /> | |
<input type="submit" value="Am i rich?" class="clickable" /> | |
</body> | |
</html> | |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment