2015-10-14 3 views
0

Я использую управление карусели. Теперь я также поддерживать коллекцию Java Script и массив, как показано ниже: Теперь это как карусель отображается в пользовательском интерфейсе:Как перейти к определенному слайду на левой кнопке «Щелчок» в карусельной загрузке вместо того, чтобы перейти к предыдущему слайду?

<div class="carousel slide " id="divFormCarousel" data-interval="false" data-ride="carousel"> 
     <!-- Indicators --> 
     <ol class="carousel-indicators"> 
      <li class="active" onclick="SetSaveAndNext()" data-target="#divFormCarousel" data-slide-to="0"></li> 
      <li onclick="SetSaveAndNext()" data-target="#divFormCarousel" data-slide-to="1"></li> 
      <li onclick="SetFinish()" data-target="#divFormCarousel" data-slide-to="2"></li> 
     </ol> 
     <!-- Wrapper for slides --> 
     <div class="carousel-inner" role="listbox"> 
     <div class="item active" id="101"> 
     <form id="frmConsentForm+101" method="post" data-url="/Forms/Save"> 
    </form> 
     </div> 
     <div class="item" id="102"> 
     <form id="frmConsentForm+102" method="post" data-url="/Forms/Save"> 
    </form> 
    </div> 
     <div class="item" id="404">   
     <form id="frmConsentForm+404" method="post" data-url="/Forms/Save"></form> 
     </div>   
     </div> 
     <a class="left carousel-control hidden-xs hidden-sm hidden-md hidden-lg" id="leftChevron" style="margin-left: -90px; filter: none;" href="#divPatientFormCarousel" data-slide="prev"><i class="fa fa-chevron-left"></i></a> 
     <a class="right carousel-control hidden-xs hidden-sm hidden-md hidden-lg" id="rightChevron" style="margin-right: -90px; filter: none;" href="#divPatientFormCarousel" data-slide="next"><i class="fa fa-chevron-right"></i></a> 
    </div> 

Теперь мы знаем:

$('#leftChevron').trigger('click'); //This actually helps us to slide to the previous slide, which s working fine! 

Но то, что я хочу для реализации здесь основано на массиве и коллекции, определенном ниже, скажем, что я на слайде с идентификатором 404, когда я нажимаю на предыдущую кнопку (которая внутренне вызывает щелчок левой кнопкой), я хочу перенаправить на этот слайд (который встречается некоторые критерии, определенные ниже), а не точный предыдущий слайд. Критерии: , когда я щелкните btnPrevious, основываясь на коллекции и массиве перенаправляет на ту форму, для которой формы [id] = 0, а не 1.

forms = {}; // Коллекция, в которой хранится formid и соответствующий им статус. формы [101] = «0», формы [102] = «1», формы [404] = «0» formsarray = []; // здесь хранится formid, как formarray [0] = 101. formarray [1] = 102, formarray [2] = 404

В принципе, используя JQuery, я думаю, что это должно быть простое исправление, поэтому любая помощь будет очень сильно искажена. Спасибо заранее.

+0

Не могли бы вы повторить то же самое на jsfiddle, http: //jsfiddle.net – dreamweiver

ответ

0

Для карусели Bootstrap есть API. Если вы знаете, какие страницы вам нужно для прокрутки, вы просто просто нужно позвонить: (. Заменить $ DIV с селектором JQuery)

$div.carousel(pageNumber); 

Кстати, вместо того, чтобы нажать на #leftChevron или #rightChevron, вы можете также использовать правильные методы API:

$div.carousel('prev'); 

и

$div.carousel('next'); 
Смежные вопросы