2012-02-24 9 views
0

別のボタン(button1)をクリックすると、テキスト入力フィールドとボタン(button2)を交互に表示および非表示するshowHide()という関数があります。テキスト入力フィールドは開いたときに自動的にフォーカスされ、これは素晴らしい動作です。element.blur()上で関数を実行する前にボタンがクリックされているかどうかをテストする

HTMLはおおよそようになります。

<button1>Show/Hide</button> 
<form> 
    <input class="hidden" type="text" /> 
    <button2 type="submit">Submit</button> 
</form> 

<script type="text/javascript"> 
    $("button1.someSelectors").click(function() {showHide();}); 
    $("input.someSelectors").blur(function() {showHide();}) 
</script> 

私は、このようなボタン1がクリックされているので、それがフォーカスを失っない限り、入力フィールドには、それを集中し、ボタン1消え失ったときにその機能を拡張したいと思います。今読んでいるように、私は入力フィールドにフォーカスがあるかどうかだけをテストしています。 button2がクリックされているかどうかを確認する方法はありますか?

私が試した:

$("input.someSelectors").blur(function() { 
    if (!$("button2.someSelectors").is(":focus")) { 
    showHide(); 
    } 
}); 

を私はボタン2をクリックしようとした場合でも、それはフォーム要素を隠しました。

代替はbutton2を、関数の「隠す」の部分でクリックされているか否かをテストすることですが、私はshowHide()に

if(!$("button2.someSelectors").click()) {do the hide part of the function} 

を追加したときに私がクリックしたときに、フォームが送信しまいましたbutton1 または button2。ここに私の問題のexampleがあります。誰も助けることができますか?

から編集:

var showHide=function(item, category) { 
    if($("input."+item+"."+category).hasClass("hidden")) { 
    $("input."+item+"."+category).show("fast").focus().removeClass("hidden"); 
    $("button.buy."+item+"."+category).show("fast"); 
    $("button.purchase."+item+"."+category).text("Never mind!"); 
    } else { 
    $("input."+item).hide("fast").addClass("hidden"); 
    $("button.buy."+item).hide("fast"); 
    $("button.purchase."+item).text("Purchase"); 
    } 
} 

答えて

1

blurtextboxのイベントはボタンのclickイベントが発生する前にトリガされます。これを避けるには、clickイベントの代わりにmousedownイベントを使用し、clickイベントの前にトリガーされます。この

$("button1.someSelectors").mousedown(function() {showHide();}); 
$("input.someSelectors").blur(function() {showHide();}) 
+1

マウスダウンを試してみてください=クリック! - >の意味は=(マウスダウンボタンとボタンとのmouseupのマウスアウトに) –

+0

これは、フォームフィールドが表示され、すぐに表示されなくなります。 showHide()関数によってinput.focus()が適用される前にinput.blur()がテストされている可能性がありますか? – Kyle

+0

'showHide'コードを表示できますか? – ShankarSangoli

関連する問題