1

次のサンプル コードがあるとします。

<input type="text" onblur="blurHandler()" />
<div class="results">
    <ul>
        <li><a href="#" onclick="clickHandler(this);">sampleText</a></li>
    </ul>
</div>

現在入力タグにフォーカスがあり、「a」タグにカーソルを合わせてクリックしたとします。ブラウザは最初に onblur イベントを処理します。

ぼかしイベントのタスクは、結果 div を非表示にすることですが、それが発生する前に結果 div のリンクをクリックできるようにする必要があります。

4

2 に答える 2

1

  • では、 div の非表示を遅らせるためblurHandlerに使用します。setTimeout()

    function blurHandler() {
    setTimeout(function () {
        //close the div
    }, 100);
    //do whatever else needs to be done
}

    jsFiddle デモ

  • 別のオプションは、リンクのmouseenter/mouseleaveイベントを操作し、イベント ハンドラー間で共通のフラグを使用して、お互いを認識できるようにすることです。

  • もう 1 つ: 短いアニメーションで div を非表示にすることができるため、クリックが発生しても実際にはそこに残ります。このようなもの：

     $('.results').hide(1000);

    jsFiddle デモ

注:高度なイベント処理を確認する必要があります。インライン イベント ハンドラーは、HTML をすぐにめちゃくちゃにする可能性があります。関心の分離は、他の人や将来の自分を助けます。jQuery を使用する場合 (質問の下のタグを参照)、高度なモデルを既に使用している jQuery のイベント処理メソッドを使用する必要があります。

于 2013-01-25T17:56:50.833 に答える
0

私は Marcell のコメントに同意しますが、おそらくユーザビリティの観点からはもっとです。

タイムアウトを割り当てる (bažmegakapa が提案するように) ということは、ユーザーがその時間制限が終了する前に行うべきことを処理する前に起動する場合としない場合がある任意の時間制限を選択していることを意味します。所定の時間枠内に反応する必要があることを UI が何らかの方法で明確にしない限り、これはユーザーの不満につながる可能性があります。

ユーザーが画面上の指示を処理する時間があったことは当然だとしても、キーボードからマウス (またはタッチ、さらに悪いことに、ソフト キーボードを非表示にするための UI の移動に対処する必要がある場合) への移行時間もあります。 )、つまり、ユーザーごとに、選択した制限時間が終了する前に指示に従う能力にさらに差があることを意味します。

対話機能の設定方法に関して、考えておくべきことがあります。

于 2013-01-25T18:06:53.603 に答える