1.jpg
【HTML】

<div class="input_comm">
    <span class="icon_email"></span>
    <label id="emailPlaceholder" class="placeholder" for="inputEmail">请输入邮箱</label>
    <input id="inputEmail" class="idx_input" type="text">
</div>
<div class="input_comm">
    <span class="icon_pwd"></span>
    <input id="inputPwd" class="idx_input" type="password">
    <label id="pwdPlaceholder" class="placeholder" for="inputPwd">请输入邮箱</label>
</div>

【JS】

function placeholder(objid,objid2){
    var fos = document.getElementById(objid);
    if(fos.value!=''){
        $("#"+objid2).hide();
    }
    fos.onfocus = function(){
        $("#"+objid2).addClass("focus");
    }
    fos.onblur = function(){
        $("#"+objid2).removeClass("focus");
    }
    var element = document.getElementById(objid);
    if("\v"=="v"){
        element.onpropertychange = webChange;
    }else{
        element.addEventListener("input",webChange,false);
    }
    function webChange(){
        if(element.value){
            $("#"+objid2).hide();
        }else if(element.value==""){
            $("#"+objid2).show();
        }
    }
}

if($('#inputEmail')[0]){
    placeholder("inputEmail","emailPlaceholder");
}
if($('#inputPwd')[0]){
    placeholder("inputPwd","pwdPlaceholder");
}