<!DOCTYPE html>
<html>
<head>
<title>Title of the document</title>
<meta charset="utf-8">
<style>
#canvas {
border: solid black 1px;
display: block;
}
</style>
<body>
<input type="text" placeholder="dasda">
<input type="text" placeholder="dasda" >
<input type="text" placeholder="dasda" >
<script>
[JS]
function addevent(obj, e, h) {if (obj.addEventListener) { obj.addEventListener(e, h, false);} else if (obj.attachEvent) { obj.attachEvent('on'+e, h);} else { obj['on'+e]=function() { h();};}} function delevent(obj, e, h) { if (obj.removeEventListener) { obj.removeEventListener(e, h, false);} else if (obj.detachEvent) { obj.detachEvent('on'+e, h);} else {obj['on'+e]=null;}}
var fn = function(){
var inp = document.querySelectorAll('input[type="text"');
for(var i = 0; i < inp.length; i++) {
inp[i].setAttribute('data-pl', inp[i].getAttribute('placeholder'));
inp[i].value = inp[i].getAttribute('placeholder');
}
var o = {
focus: function (e) {
e = e.target || e.srcElement;
if(!e.type == 'text') return;
if(e.value == e.getAttribute('data-pl')) {
e.value = '';
e.style.color = 'black'
}
addevent(e, 'blur', o.blur);
},
blur: function (e) {
e = e.target || e.srcElement;
if(e.value === '' || e.value == ' ') {
e.value = e.getAttribute('data-pl');
e.style.color = 'silver';
}
delevent(e, 'blur', o.blur);
},
createPlaceholder: function (place) {
var input = document.createElement('input');
input.type = 'text';
if('placeholder' in document.createElement('input') input.placeholder = place;
else input.setAttribute('data-bl', plc);
return input;
},
event: function () {
if('placeholder' in document.createElement('input')) return;
addevent(document.body, 'click', o.focus);
addevent(document.body, 'blur', o.blur);
}
}
o.event();
return o;
};
var fn1 = fn()
console.log(fn1)
[/JS]
</script>
</html>
через createPlaceholder можно создавать смело input.
