クリックするとテキストフィールドが空になります（javascriptのプロトタイプフレームワーク）

Question

私の入力フィールドです。私はそれをクリックするとその価値を空にしたい。どのように私はjavascriptのプロトタイプフレームワークを使用してこれを行うことができますか？

<input name="ctl0$txtSearch" type="text" value="Quick Search" id="ctl0_txtSearch" class="MainSearchBar" /> 

事前のおかげで、

は実際に私がPRADOを使用しています。だから、入力を作成するためにhtmlタグは

<com:TTextBox Id="txtSearch" Text="Quick Search" CssClass="MainSearchBar" /> 

あり、それには、JavaScriptを処理するために、何のonclickのattrのを持っていません。

Answer 1

のonClickは、このようなに 'タブ付き' されているとキーボードイベントに応答しません。このためにonFocusを使用することをお勧めします。また、操作を補完するためにonBlurを使用することもできます。

<com:TTextBox Id="txtSearch" Text="Quick Search" CssClass="MainSearchBar" 
     Attributes.onfocus="if (this.value == this.defaultValue) this.value = '';" 
     Attributes.onblur="if (this.value == '') this.value = this.defaultValue;" 
     /> 

Answer 2

あなたはまた、このコードを試してみてください（...フィールドをクリアするだけでなく、CSSを追加する）あなたのテキストフィールドの動作をカスタマイズすることができる場所にしたい場合：一人で

$('ctl0_txtSearch').observe('click', respondToClick); 

function respondToClick(event) { 
    var element = event.element(); 
    element.clear(); 
    // ... do more customization here 
} 

JSをクリアするのに十分ですフィールドは入力フィールド自体のonClick="javascript:this.value=''"属性を使用するだけです。

Answer 3

これを試してみてください：

<input name="ctl0$txtSearch" type="text" value="Quick Search" id="ctl0_txtSearch" 

class="MainSearchBar" onClick="javascript:ctl0_txtSearch.value='';" /> 

Answer 4

をここに行く：

<input name="ctl0$txtSearch" type="text" value="Quick Search" id="ctl0_txtSearch" class="MainSearchBar" onclick="this.value = '';" />