32

(ExtJS) ツールバー ボタンがクリックされたときに Web ページのフォーカスを取得するのではなく、クリックによってフォーカスを変更せずに「処理」を実行する必要があります。それ、どうやったら出来るの？

4

11 に答える 11

47

のデフォルトの動作をキャンセルするとonmousedown、要素がフォーカスを取得できなくなります。

// Prevent capturing focus by the button.
$('button').on('mousedown', 
    /** @param {!jQuery.Event} event */ 
    function(event) {
        event.preventDefault();
    }
);
于 2015-06-20T02:49:53.927 に答える
6

document.activeElementは、現在フォーカスされている要素を格納します。

したがって、ツールバーで、この関数に「マウスダウン」ハンドラーを追加できます。

function preventFocus() {
  var ae = document.activeElement;
  setTimeout(function() { ae.focus() }, 1);
}

この例を試してください：

<html>
<head>
<script>
function preventFocus() {
  var ae = document.activeElement;
    setTimeout(function() { ae.focus() }, 1);
}
</script>
</head>
<body>
<input type="text"/>
<input type="button" onmousedown="preventFocus()" onclick="alert('clicked')" value="Toolbar" />
</body>
</html>
于 2009-06-12T10:52:39.027 に答える
5

これは通常、私にとってはうまくいきます：

<button 
  tabindex="-1"
  onclick="javascript:console.log('do your thing')"
>My Button</button>

https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindexから:

負の値 (通常はtabindex="-1") は、要素がフォーカス可能であるべきであることを意味しますが、シーケンシャル キーボード ナビゲーションを介して到達可能であってはなりません。JavaScript を使用してアクセシブルなウィジェットを作成すると、たいてい役に立ちます。

于 2018-09-17T15:54:07.107 に答える
4

ブラウザのデフォルトの動作であるため、やりたいことを簡単に実行できる方法はないと思います。

もちろん、クリックしたらすぐにボタンを blur() することもできますが、それでは単にすべての選択が解除されます。以前にアクティブだったオブジェクトにフォーカスを取り戻すには、すべての要素にぼかしハンドラーを追加して、どの要素が最後にフォーカスを持っていた/失ったかを追跡することによって、ある種の「メモリ」を作成する必要があります (グローバルに要素の ID を保存します)。要素がフォーカスを失ったときに更新します)。

于 2009-06-12T10:45:12.710 に答える
2

私の解決策は、それをボタンとして置き換え<button />てスタイルすることです。<div />Div をクリックしてもフォーカスされていないようです。

于 2021-03-02T16:38:37.707 に答える
1

すべてのフィールドに 1 つのぼかしイベント リスナーをアタッチします。このリスナーは、フォーカスを失ったフィールドをグローバル変数に保存する必要があります。

次に、すべてのツールバー ボタンが 1 つのフォーカス イベント リスナーを取得する必要があります。このリスナーは、上記のように保存されたフィールドにフォーカスする必要があります。

このコードは動作するはずですが、テストはしていません

于 2009-06-16T08:43:39.493 に答える
1

statefulフォーカスを戻すには、フォーム フィールドなどの変更プロパティを使用して状態を変更する必要がありますか?

于 2009-06-12T10:37:30.577 に答える
1

ツールバー ボタンは通常の HTML ボタン要素のスタイルを設定しただけなので、これは実際のブラウザーの動作であり、変更する前によく考える必要があります。しかし、それにもかかわらず...

ハンドラーfalseから戻るだけで、ボタンがフォーカスを受け取るのを防ぐことができるはずです。onclick

于 2009-06-11T17:06:30.963 に答える
-3

これらの答えはすべて奇抜です。これは、CSSのみを使用する非常に優れたトリックです

<button type="submit" disabled>
  <span>Submit</span> <!-- the <span> is the secret -->
</button>

今あなたのCSSで：

button[disabled] > * {
  pointer-events: none;
}

トリックは、内側のスパンを使用する必要があることです。そうしないと、ボタンは入力からフォーカスを奪います。

于 2020-10-09T21:48:55.577 に答える