Skip to content

Instantly share code, notes, and snippets.

@chuck0523

chuck0523/jQueryLikeReact02.html

Created January 3, 2016 11:10
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save chuck0523/2659a8ad69ddb03968e4 to your computer and use it in GitHub Desktop.
Save chuck0523/2659a8ad69ddb03968e4 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
jQueryLikeReact02.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>React風のjQuery</title>
<script src="http://code.jquery.com/jquery-1.11.3.min.js"></script>
</head>
<body>
<span id="colored-counter">0</span>
<input id="color"></input>
<button id="inc"></button>
<script>
var state = {color: '', value: 0};
function updateUI() {
$('#colored-counter').css('color', state.color);
$('#colored-counter').html(state.value);
}
$('#color').on('keyup', function () {
state.color = this.value;
updateUI();
});
$('#inc').on('click', function () {
state.value++;
updateUI();
});
</script>
</body>
</html>
<!-- code is cited from http://postd.cc/boiling-react-down-to-a-few-lines-in-jquery/ -->
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment