2

入力の上にラベルを重ねたフォームがあります。下の画像のように

スクリーンショット

以下は、同じコード例です。

<label for="edit-submitted-name--2">
Name
<span class="form-required" title="This field is required.">*</span>
</label>
<input id="edit-submitted-name--2" class="form-text required" type="text" maxlength="128" size="35" value="" name="submitted[name]">

jquery を使用して、ユーザーが入力にフォーカスするたびにラベルを非表示にしたいと考えています。ラベルは、入力が空の場合、または入力がフォーカスされていない場合にのみ表示されます。

  $("input").focus(function () {
          //hide the label corresponding to this input
     });

jqueryを使用してこの入力に対応するラベルを選択するにはどうすればよいですか?

注: Drupal のモジュールによって生成されるため、html で何も変更することはできません。

4

3 に答える 3

5

プレースホルダー属性は、このジョブに適したツールです。

<input id="edit-submitted-name--2" class="form-text required" type="text" maxlength="128" size="35" placeholder="Name *" name="submitted[name]">

http://www.w3schools.com/html5/att_input_placeholder.asp

ただし、ラベルのない入力フィールドは悪い習慣であることを忘れないでください。プレースホルダーはヒントのように扱う必要があります。ラベルの代わりにはなりません。

于 2012-05-23T20:30:45.280 に答える
3

現在の要素から前の要素を選択します。

$(this).prev("label").hide();

と

$(this).prev("label").show();

ただし、これはlabel要素の目的ではありません。

于 2012-05-23T20:32:18.350 に答える
1

Remy Bachは、あなたが望むことを行うスーパーラベルを作成しました。私は彼のコードを使用しますが、少し異なるものを探している場合は、彼のコードをテンプレートとして使用できます。

https://github.com/remybach/jQuery.superLabels

于 2012-05-23T20:31:25.737 に答える