61

jQuery UI Autocomplete を使用して、MySQL データベース内の人々の名前のリストを表示しようとしています。基本的な機能は機能しています - 2文字以上入力すると、可能な名前のリストが表示されます - しかし、マウスをリストの上に置くか、下向きのキーを押してリストにアクセスすると、消えます (下の2つのスクリーンショットはこれを説明します)。

これが意味することは、リストに実際にアクセスできないため、オートコンプリートが無意味になるということです! 誰かが助けることができれば、私は最も感謝しています! スクリーンショットとコードは以下に掲載されています。

最初の数文字を入力すると、メニューが表示されます

スクリーンショット 1

ただし、マウスをホバーするか、「下」キーを押すと、選択を行う前に消えます

スクリーンショット 2

HTML:

  <div id="chooseaccount">
  Choose Account to Edit
  <div id="iechooseaccountlabel" class="labeldiv">
    <!--[if IE]>
     Enter Student Name
    <![endif]-->
   </div>

  <input type="text" class="inputs" id="editname" placeholder="Enter Student Name" />

  </div>

jQuery:

$(document).ready(function(){

$("#editname").autocomplete({
 source: "names.php",
 minLength: 2,
});

});

PHP:

<?php  

$mysqli = new mysqli('********', '********', '**********', '*********');
$text = $mysqli->real_escape_string($_GET['term']);

$query = "SELECT name FROM users WHERE name LIKE '%$text%' ORDER BY name ASC";
$result = $mysqli->query($query);
$json = '[';
$first = true;
while($row = $result->fetch_assoc())
{
if (!$first) { $json .=  ','; } else { $first = false; }
$json .= '{"value":"'.$row['name'].'"}';
}
$json .= ']';
echo $json;

?>  
4

6 に答える 6

202

このエラーは、 2つのjQueryUIファイルがクライアントのブラウザーに同時にロードされたときに発生する競合が原因で発生します。セクションにピークを迎えると、<head>おそらく2つの異なるjQueryUIファイルが参照されていることがわかります。1つを削除するだけで、機能します。

于 2013-02-26T12:14:17.527 に答える
5

私は同じ問題を抱えていましたが、一度にDOMにjquery-uiスクリプトタグを1つしか持っていませんでした。script タグを含むコンテンツを Ajax で読み込んでいました。1 つのページでこれを 2 回行った場合、2 番目の要求の内容が最初の内容を置き換えていたとしても、オートコンプリート ドロップダウンが壊れてしまいます。1 つの回避策は、jquery-ui スクリプトを含むコンテンツをレンダリングする前に、次の行を追加することです。

$.ui = null;

于 2015-04-21T22:49:09.960 に答える
1

ヘッダーに読み込まれる jquery ファイルにはすべての UI 要素が含まれており、ファイルに自動的に追加されるものには、アップロードする必要のない children 要素があるため、削除する必要があります。

于 2016-02-17T05:39:53.643 に答える
0

タイプヘッドで同様の問題がありました

focus() を使用したところ、問題は解決しました。

例:

$(ele).typeahead({source: $scope.varMap['abc'], items: undefined});
$(ele).focus();
于 2019-07-03T20:10:06.507 に答える