2016-01-27 5 views
2

Я работаю над загрузочными «вкладками содержимого» и в качестве руководства для начинающих у меня есть следующий код.

JS

$('#openBtn').click(function() { 
    $('#myModal').modal({ 
     show: true 
    }) 
}); 
$('#myTab a').click(function(e) { 
    e.preventDefault(); 
    $(this).tab('show'); 
}); 

$(function() { 
    $('#myTab a:last').tab('show'); 
}) 
$("[data-toggle=tooltip]").tooltip(); 
$("[data-toggle=popover]").popover(); 
$(".alert").delay(200).addClass("in").fadeOut(3500); 

$(".alert").addClass("in").fadeOut(3500); 

$('.typeahead').typeahead({ 
    source: function(typeahead, query) { 
     /* put your ajax call here.. 
     return $.get('/typeahead', { query: query }, function (data) { 
      return typeahead.process(data); 
     }); 
     */ 
     return ['alpha', 'beta', 'bravo', 'delta', 'epsilon', 'gamma', 'zulu']; 
    } 
}); 
$("[rel='tooltip']").tooltip(); 

$('.thumbnail').hover(
    function() { 
     $(this).find('.caption').slideDown(250); //.fadeIn(250) 
    }, 
    function() { 
     $(this).find('.caption').slideUp(250); //.fadeOut(205) 
    } 
); 

HTML

<div class="container"> 
    <div class="row"> 

<div class="tabbable"> 
    <ul class="nav nav-tabs"> 
    <li class="active"><a href="#tab1" data-toggle="tab">Section 1</a></li> 
    <li><a href="#tab2" data-toggle="tab">Section 2</a></li> 
    </ul> 
    <div class="tab-content"> 
    <div class="tab-pane active" id="tab1"> 
     <p>I'm in Section 1.</p> 
    </div> 
    <div class="tab-pane" id="tab2"> 
     <p>I'm in Section 2.</p> 
    </div> 
    </div> 
</div> 
</div> 

Когда я бегу этот код его дает мне следующую ошибку:

"Uncaught TypeError: $(...).typeahead is not a function"

Хотя мои закладки работают, но его затрагивая другой p искусство кода, которое перестало работать. Если я удалю эту часть кода функции Tophead из моего JS-файла, то моя другая часть кода работает отлично, но затем вкладки не работают.

Любые рекомендации в этом отношении будут высоко оценены.

Заранее спасибо

+0

вы включены http://twitter.github.io/typeahead.js/ на вашей странице? –

+0

Также библиотека 'jQuery'. –

ответ

1

Просто удалите следующий код из JS-файла.

$(function() { 
      $('#myTab a:last').tab('show'); 
     }) 
     $('.typeahead').typeahead({ 
     source: function (typeahead, query) { 
      put your ajax call here.. 
      return $.get('/typeahead', { query: query }, function (data) { 
     return typeahead.process(data); 
     }); 

    return ['alpha','beta','bravo','delta','epsilon','gamma','zulu']; 
    } 
    }); 

Добавить следующий код вместо этого

$(".nav-tabs a").click(function(){ 
     $(this).tab('show'); 
    }); 
+0

Спасибо за помощь. Это хорошо работает .. !! –

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