0

Jquery オートコンプリートを使用しており、カスタム フォーカス メソッドを作成しました。目標は、要素がフォーカスされている間に追加情報を表示し、ぼかし時に要素をデフォルトの状態に戻すことです。オートコンプリートにはぼかしメソッドが組み込まれていないため、mouseleave を使用して独自のものをハックしました。

focus: function( event, ui ) {
  event.preventDefault();
  var menu = $(this).data("uiAutocomplete").menu.element;
  var focused = menu.find("li:has(a.ui-state-focus)");
  var child = $(focused).children().first();
  var item = ui.item.value;
  var text = "<div>" + item.name + "</div>";
  if (item.publications.length > 0) text += "<div>" + item.publications + "</div>";
  $(child).html(text).attr("name", item.name);
  $(focused).on("mouseleave", function() {
    $(child).html($(child).attr("name"))
  });
},

これはマウスのロールオーバーで機能しますが、ユーザーがキーボードを使用してリストを上下に移動する場合は機能しません。そのためには、focusout のようなものを使用する必要があります。

$(focused).on("focusout", function() {
  $(child).html($(child).attr("name"))
});

残念ながら、focusout には明らかな効果はありません。エラーメッセージも、変更されたテキストもありません。マウスオーバーでも。何が起こっているのか分かりますか?

4

1 に答える 1

0

li(その) に何らかの値を持つ:has(a.ui-state-focus)属性を与えます。tabindex<li tabindex="0"><a[...]</li>

LE: html 要素tabindexを可能にします。そのため、ぼかしでfocusトリガーできます。focusout

于 2013-02-14T15:46:19.907 に答える