検索バーでカーソルが表示される前にダブルクリックする必要があります

Question

ダブルクリックではなくクリックした後にカーソルを検索バーに表示させるには、コードを変更する必要がありますか？または、フィールドへのワンクリック後にプレースホルダが消えないのはなぜですか？ （値とプレースホルダーの基本的な考え方は、このようにとどまるべきです）。

HTML

<form action="search.php" method="GET"> 
    <input type="text" name="q" id="searchbox" placeholder="" value="Suche..." maxlength="99" autocomplete ="off" onMouseDown="active();" onBlur="inactive();"/> 
    <button id="searchbutton"> Los!</button> 
</form> 

Javascriptを

function active(){ 
    var searchbox = document.getElementById('searchbox'); 
    if(searchbox.value == 'Suche...'){ 
     searchbox.value = '' 
     searchbox.placeholder = 'Suche...'   
    } 
} 

function inactive(){ 
    var searchbox = document.getElementById('searchbox'); 

    if(searchbox.value == ''){ 
     searchbox.value = 'Suche...' 
     searchbox.placeholder = '' 
    } 
} 

Answer 1

プレースホルダを作るために、すべてのそのコードを使用する必要はありません。あなたはちょうどこれが必要です：

<form action="search.php" method="GET"> 
    <input type="text" name="q" id="searchbox" placeholder="Suche..." maxlength="99" autocomplete ="off"> 
    <button id="searchbutton"> Los!</button> 
</form> 

そしてそれは動作します。プレースホルダタグを使用すると、プレースホルダタグをクリックして入力を開始すると、テキストが消えてしまいます。そのためにJavaScriptコードは必要ありません。

もう1つのことは...そのコードは「jQuery」コードではなく、単にJavaScriptコードです。プレースホルダの色の使用のCSS変更するには

：あなたはここに期待しているもの

::-webkit-input-placeholder { 
    color: black; 
    } 

:-moz-placeholder { /* Firefox 18- */ 
    color: black; 
} 

::-moz-placeholder { /* Firefox 19+ */ 
    color: black; 
} 

:-ms-input-placeholder { 
    color: black; 
}