0

データベースから名前のリストを取得し、jspページにアルファベット順に表示しました。

ページの上部に、クリック可能なアルファベットを表示して、文字をクリックすることでユーザーが右側のセクションに移動できるようにします。

これを実現するためのjqueryプラグインはありますか？また？

編集

ABC ....（Aで始まる要素がある場合、Aはリンクです）

リンゴ

Bバナナブック

C..。

編集2

ここでjquerylistnavプラグインを使用しようとしています

jspファイルには、次のものがあります。

<script type="text/javascript" src="js/jquery.listnav-2.1.js"></script>
<script type="text/javascript">
    $(function(){
        $('#myList').listnav();
    });
</script>

その後：

<div id="myList-nav"></div>
<ul id="myList">
<li>one</li>
<li>two</li>
<li>three</li>
<li>four</li>
<li>five</li>
</ul>

プラグインは正しくロードされていますが、firebugは次のメッセージを表示します。

TypeError: $(...).listnav is not a function
error source line: $('#myList').listnav();

どこが間違っているのかわかりません。

4

1 に答える 1

1

私の理解が正しければ、最初の文字に基づいてデータを分割し、ユーザーがその文字で一連の結果をフィルター処理できるようにする必要がありますか?

これは jquery プラグインではなく、他の誰かがおそらくもっと良いものを書くことができますが、私はここに JSFiddle を書きました。

基本的な動作方法は、文字列の配列を渡すと、その配列を読み取り、各文字列の最初の文字から検出されたアルファベットの各文字のデータを個々の配列に分割します。次に、それぞれのボタンを作成し、そのボタンをクリックすると、そのデータのみが表示されます。

forこれは、ループをかなり頻繁に使用する場合にすぎないため、読み込みが非常に遅くなる可能性がありますが、読み込みが完了すると、パフォーマンスが向上するはずです。

代わりに、クリックされた最初の文字に一致するアイテムのみを選択するたびに配列全体を反復処理することもできます。これにより、ロード時間が短縮されますが、一般的な使用でははるかに遅くなります。

編集 - これのモジュラー バージョンを作成したのでAlphaSplit、配列を使用して新しいインスタンスをインスタンス化し、その上で .create() メソッドを呼び出すだけです。動作中のバージョンはこちらで確認できます。

于 2013-03-01T13:48:56.877 に答える