2016-06-04 2 views
1

Я пытаюсь активировать ссылку при нажатии кнопки мыши, но до ее отпускания.Активировать ссылку, прежде чем выпустить кнопку мыши

пример кода http://codepen.io/MHUMPHRI/pen/GqJGre?editors=1010re?editors=1010

В моем примере кода содержание в закладках РИТ отображается при выборе ссылка LHS и отпускании кнопки мыши. Я хочу, чтобы содержимое вкладки отображалось сразу же после нажатия кнопки мыши. Благодарен за любую помощь. Майк

<head> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script> 
    <script 
    <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script> 
    <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet" /> 
</head> 

<div class="container-fluid"> 
    <div class="row"> 
    <div class="nopadding col-xs-4"> 
     <a class="active" data-toggle="pill" href="#content1"> 
     <div class="blue-box col-xs-12"> 
     <h1>box1<h1> 
       </div> 
      </a> 
     <a data-toggle="pill" href="#content2"> 
       <div class="blue-box col-xs-12"> 
       <h1>box2<h1> 
       </div> 
       </a> 
        <a data-toggle="pill" href="#content3"> 
       <div class="blue-box col-xs-12"> 
       <h1>box3<h1> 
       </div> 
       </a> 
       </div> 
        <div class="nopadding col-xs-8"> 
        <div class="tab-content"> 
         <div id="content1" class="tab-pane fade in active"> 
         <div class="col-xs-12 grey-box"> 

        <h1>output1<h1> 
         </div> 
         </div> 
          <div id="content2" class="tab-pane fade"> 
         <div class="col-xs-12 grey-box"> 
         <h1>output2<h1> 
          </div> 
          </div> 
                <div id="content3" class="tab-pane fade"> 
         <div class="col-xs-12 grey-box"> 
         <h1>output3<h1> 
          </div> 
          </div> 
         </div> 
        </div> 
+0

Вы не можете использовать стандартные компоненты начальной загрузки, потому что они ищут события 'click'. Вам нужно будет написать собственные обработчики для событий «mousedown». –

+0

спасибо - я дам вам попробовать – MikeMcClatchie

ответ

3

, так как вы импортировали JQuery, вот решение JQuery:

первый, начать свой JQuery с $(document).ready(function() { ... });

затем добавить код:

var pills = $('a[data-toggle="pill"]'); 
pills.mousedown(function() { 
    this.click(); 
}); 

этот путь , всякий раз, когда вы щелкаете и удерживаете (.mousedown)
вы wi Вызов целого события .click на том же элементе.

+0

спасибо. это работает. очень признателен – MikeMcClatchie

Смежные вопросы