0

ユーザーが入力フィールドをクリックしたときに div を表示しようとしていますが、いくつかの問題があります...

1) ユーザーが入力フィールドをクリックすると、div が表示されますが、div を操作すると、div が消えます... ユーザーが div を操作している間、フィールドをアクティブに保つにはどうすればよいですか?

2) 複数のフィールドがあり、以下のコードを使用しています...複数のフィールド ID に設定し、特定の各 div に関連付けられた div を表示するにはどうすればよいですか (つまり、入力フィールド id=age は div id=tip-age を示します。入力フィールド id=height -- div id=tip-height を示します)

これについても jsfiddle を作成しましたhttp://jsfiddle.net/NEmYv/

HTMLコード

<form id="measure">
<div id="tip-age" style="display:none;">text here</div>
<input type="text" id="age" />
<input type="submit">
</form>

jQuery

$("#age").focusin(function() {
    $("#tip-age").show();
}).focusout(function () {
    $("#tip-age").hide();
});

これが jQuery API で解決される可能性があることは理解していますが、この問題については本当にあなたの助けを借りることができます。これが卑劣な質問である場合は、事前にお詫び申し上げます...

4

1 に答える 1

2

お客様の要件を満たすデモを作成しました。ここでデモを見ることができます：

ここでのフィドルコード は私がしたことです:

$(".show-hidden-div").click(function() {
var inputId = $(this).attr('id');
$("#tip-"+inputId+"").show();});

ご覧のとおり、それぞれに関連する非表示の div を持つ 2 つの入力を作成しました。クラス「show-hidden-input」を追加して、関連するすべての入力をjqueryを使用してクリックイベントで処理できるようにしました。「show-hidden-input」クラスの入力がクリックされると、一意の ID を取得し、それを使用して関連する隠し div を見つけます。次に、関連する div を表示します。

于 2012-06-16T00:17:30.943 に答える