Html：テキストフィールドの空白を修正してください

Question

テキストフィールドの値のスペースを修正する方法はありますか？テキストフィールドが表示されたときに既にスペースがあり、スペースの後にユーザーが値を入力することを意味します。また、ユーザーはその値を消去すると、その領域を削除することはできません。私はこのことがパディングによって行えることは知っていますが、私には問題があり、修正スペースが必要です。

<input type="text" id="search" value="fix space" /> 

テキストフィールド：（固定スペース）ユーザー値

Answer 1

あなたは、スペースをチェックし、必要であれば、それを追加してからkeyupイベントを使用することができます。

<input id="mytb" type="text" onkeyup="addSpace()" /> 

function addSpace() { 
    var tbVal = $('#mytb').val(); 
    if (tbVal.substring(0, 1) != ' ') $('#mytb').val(' ' + tbVal); 
} 

Answer 2

うーん、CSSが移動するための方法ですが、それの音から、あなたはスペースが提出されますデータの一部になりたいです。

これが当てはまる場合は、送信ハンドラのスペースをプレフィックスにしないでください。

Answer 3

私はあなたがスペースは、ユーザー入力に前に前置することにしたいと思います。 これは視覚効果のためのものであれば、以下のようにCSSを変更する必要があります。

input{ 
padding-left: 10px; 
} 

あなたはフォームが送信されたときに、ユーザーの入力の前にスペースを追加するには、以下のJavascriptを使用することができます含まれる実際の空白文字が必要な場合。

document.getElementById('search').addEventListener('blur', function() { 
    if (this.value.indexOf(' ') != 0) { 
    this.value = ' ' + this.value; 
    } 
}, false); 

または：：あなたがからkeyup使用したり、イベントをぼかすことができますいずれか

function DoSubmit(){ 
    var elem = document.myform.search.value; 
    document.myform.search.value = ' '+elem; 
    return true; 
} 

Answer 4

document.getElementById('search').addEventListener('keyup', function() { 
     if (this.value.indexOf(' ') != 0) { 
     this.value = ' ' + this.value; 
     } 
    }, false);