div要素のcontentEditable属性が入力ボックスとしても使用することができましょう

あなたはdiv要素は、入力ボックスそれとして使用することができます知っていますか？

contentEditableグローバルH5の特性、代わりに、入力ボックス（divの高さを自動的に内容に応じて調整することができる）などのcontentEditable属性を入力又はTEXTAREAのDIVの、それはDIVプレースホルダプロパティをサポートしていません。それはデフォルトのテキストを表示するときにどのようにdivの中は空ですか？

構文入力ボックス

<element contenteditable="true|false">

    <div class='input' contenteditable placeholder='请输入文字'></div>
    /**css样式*/
    .input{
        width:200px;
        height:24px;
        line-height:24px;
        font-size:14px;
        padding:5px 8px;
        border:1px solid #ddd;
    }
    .input:empty::before {
        content: attr(placeholder);
    }

フォーカス時には、コンテンツプレースホルダが消えないので、それで書き込みは、完璧ではありません

プレースホルダをシミュレートする方法を書くことができます

ele.val（）、それはここで使用されるele.text（）値を使用する唯一の入力、TEXTAREAため、この方法は、入力におけるアナログ処理と互換性のコースの缶
使用プレースホルダ。

<div class='input' contenteditable></div>
function checkValue(obj,tipText){
        $(obj).focus(function(){
            if( obj.text()== tipText ){
                obj.text("");
            }
        });
        $(obj).blur(function(){
            if( obj.text()=="" ){
                obj.text(tipText);
            }
        });
        if( $.trim( obj.text() )=="" ){
            obj.text(tipText);
        }
    }
    checkValue($(".input"),'请输入文字');

---

オリジナル著者：Katherine_Lisa