placeholder.html
Click here to get the file
Size
1.5 kB
-
File type
text/html
File contents
<html>
<head>
<script src="http://closure-library.googlecode.com/svn/trunk/closure/goog/base.js"></script>
<script>
goog.require('goog.array');
goog.require('goog.dom');
goog.require('goog.events');
goog.require('goog.events.EventHandler');
goog.require('goog.events.EventTarget');
goog.require('goog.events.EventType');
goog.require('goog.positioning.AnchoredPosition');
goog.require('goog.style');
goog.require('goog.Timer');
</script>
<script src="http://dev.ariel-networks.com/Members/uchida/stuff/placeholder.js"></script>
<style>
.placeholder {
position: absolute;
color: #888;
overflow-x: hidden;
white-space: nowrap;
font-weight: normal;
}
#num1, #num2 {
width: 200px;
}
#answer {
}
</style>
</head>
<body>
<input id="num1" type="text"></input>
+
<input id="num2" type="text"></input>
=
<span id="answer">0</span>
<script>
var els = [goog.dom.getElement('num1'), goog.dom.getElement('num2')];
function calc() {
var sum = goog.array.reduce(els, function(sum, el) {
return (parseInt(el.value, 10) || 0) + sum;
}, 0);
goog.dom.setTextContent(goog.dom.getElement('answer'), sum);
}
goog.array.forEach(els, function(el) {
new PlaceHolder(el, '数値を入力してください', false);
goog.events.listen(el, goog.events.EventType.CHANGE, calc);
});
</script>
</body>
</html>