2

未編集のスクリプトは次のとおりです。

// for each slide create a list item and link
control.children().each(function(){
    $('.' + option.paginationClass, elem).append('<li><a href="#'+ number +'">'+ (number+1) +'</a></li>');
    number++;
});

これは、ページネーション スクリプトの一部です。このスクリプトの実行により、スライドショー内の各スライド リンクにマークアップが追加されます。最初のリンクに「1」というラベルが付けられ、追加のスライド リンクごとに 1 が追加されます。したがって、スライドを制御するための一連のナビゲーション リンクを作成します。私は 4 つのスライドを持っているので、リンクのリストは次のようになります: '1 2 3 4'... "ページネーション" とは何かを既に知っていると思います...

これを行うにはどうすればよいですか:上記のスクリプトを編集して、各スライド リンクの追加時に特定の特定のマークアップを出力できるようにしたい (代わりに '1 2 3 4' )。以下は、いくつかの疑似コードが混在したスクリプトの編集バージョンです。より良いアイデアを得るために読むことができます。

個々のリンクをカスタマイズする私の試みは次のとおりです。

// for each slide create a list item and link
control.children().each(function(){

     if (number = 1) {LABEL = 'Link for slide 1 blah'}
     if (number = 2) {LABEL = 'Lnk for slide 2 boo'}
     if (number = 3) {LABEL = 'Link fore slide 3 foo'}
     if (number = 4) {LABEL = 'Linkage fo slide 4 yoooou'}

     $('.' + option.paginationClass, elem).append('<li><a href="#'+ number +'">'+ (LABEL) +'</a></li>');
     number++;
});

これは、視覚的なデモがないと難しい質問ですが、優れた JavaScript/jQuery スキルを持つ人なら、何が欠けているか、どの行を追加する必要があるかを確実に確認できます。これは、基本的なナビゲーションやスライドショー用のページネーション リンクを簡単にカスタマイズしたい多くの UI / UX 開発者に役立ちます。前もって感謝します！

4

1 に答える 1

1

さて、値を比較するのではなく値を設定しているため、すべてのifステートメントは次trueのように変更されます。

 if (number = 1) {LABEL = 'Link for slide 1 blah'}

に：

 if (number === 1) {LABEL = 'Link for slide 1 blah'}

each関数の最初のパラメーターは、演算子indexを使用する必要がないためです。++

control.children().each(function(number){

配列を定義することもできます:

var labels = [
    'The First Label',
    'Second One',
    '...'
];

そしてコード：

 $('.' + option.paginationClass, elem)
   .append('<li><a href="#'+ number +'">'+ labels[number] +'</a></li>');
于 2012-11-12T08:20:31.960 に答える