2

JQTouch を使用して構築されたサイトがあり、テキスト入力フィールド内に小さな十字ボタンを追加して、プレス時にテキストを消去したいと考えています。

Google の技術を google.com の iPhone サイトからエミュレートしてみました。また、ここでそのアプローチについて読んだことがあります mobileSafariのiphoneのテキストフィールド入力の小さな「x」? ...

私はこれを部分的に機能させています。しかし、十字ボタンの押下が登録されているかどうか、いつ登録されているかは信頼できないようです。

これをテストするための最小限のコードを作成しました。

JQTouch を使用 - http://hogtownconsulting.com/clearquery/index.html

JQTouch (またはその他の JS ライブラリ) なし - http://hogtownconsulting.com/clearquery/index-no-js.html

これらの問題を引き起こしているのが JQTouch ライブラリとのやり取りであるかどうかはわかりません。しかし、JQTouch を使用しないバージョンは、十字ボタンのタップに対する応答がより優れているように見えます。この機能を適切に動作させる方法についての提案は大歓迎です。ありがとう、パトリック

4

1 に答える 1

4

input type = search という名前を付けると、小さな X が自動的に取得されます。

<input type=search name=s>

この記事は大いに役立ちます。 WebKit の CSS トリック

その入力を type = search にしたくない場合は、少し偽装する必要があります。1. div を作成し、css を使用して丸めます。2. 入力をそこに置き、Webkit の装飾、シェーディングなどを削除します。 3. 入力の右側に X 画像を含む SPAN を配置します。その画像に onclick を追加して、フィールドをクリアします。

<div><input type="text" id="thing"/><span onclick="clrField();"><img src="x.gif"/></span></div>
于 2010-09-04T16:07:27.040 に答える