0
我在我的網站上HAML文件中的以下代碼：的jQuery UI + Rails的
= stylesheet_link_tag "web-app-theme/base2", "web-app-theme/themes/activo/style", "web-app-theme/override", 'web-app-theme/tabs'
= javascript_include_tag 'tabber.js', 'jquery-1.3.2.min.js', 'jquery-ui-1.7.custom.min.js'
:javascript
$(function() {
var $tabs = $('#tabs').tabs();
$(".ui-tabs-panel").each(function(i){
var totalSize = $(".ui-tabs-panel").size() - 1;
if (i != totalSize) {
next = i + 2;
$(this).append("Next Page »");
}
if (i != 0) {
prev = i;
$(this).append("« Prev Page");
}
});
$('.next-tab, .prev-tab').click(function() {
$tabs.tabs('select', $(this).attr("rel"));
return false;
});
});
#page-wrap
#tabs
%ul
%li
%a{:href => "#fragment-1"} 1
%li
%a{:href => "#fragment-2"} 2
%li
%a{:href => "#fragment-3"} 3
%li
%a{:href => "#fragment-4"} 4
%li
%a{:href => "#fragment-5"} 5
%li
%a{:href => "#fragment-6"} 6
%li
%a{:href => "#fragment-7"} 7
%li
%a{:href => "#fragment-8"} 8
%li
%a{:href => "#fragment-9"} 9
%li
%a{:href => "#fragment-10"} 10
%li
%a{:href => "#fragment-11"} 11
%li
%a{:href => "#fragment-12"} 12
%li
%a{:href => "#fragment-13"} 13
%li
%a{:href => "#fragment-14"} 14
%li
%a{:href => "#fragment-15"} 15
#fragment-1.ui-tabs-panel
%p Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo.
#fragment-2.ui-tabs-panel.ui-tabs-hide
%p Donec ultricies senectus tristique egestas vitae, et ac morbi habitant quam sit mi quam, malesuada leo. Vestibulum tempor Mauris tortor libero eget, egestas. eu vitae feugiat netus amet Pellentesque ante. amet, ultricies eleifend turpis sit placerat et semper. Aenean est. fames
#fragment-3.ui-tabs-panel.ui-tabs-hide
%p ante. Mauris Vestibulum est. fames egestas quam, leo. amet tristique sit libero egestas. ultricies mi turpis senectus Pellentesque habitant eu ac morbi netus eget, Aenean malesuada vitae, semper. eleifend et feugiat vitae amet, placerat Donec et tortor ultricies tempor quam sit
#fragment-4.ui-tabs-panel.ui-tabs-hide
#fragment-5.ui-tabs-panel.ui-tabs-hide
#fragment-6.ui-tabs-panel.ui-tabs-hide
#fragment-7.ui-tabs-panel.ui-tabs-hide
#fragment-8.ui-tabs-panel.ui-tabs-hide
#fragment-9.ui-tabs-panel.ui-tabs-hide
#fragment-10.ui-tabs-panel.ui-tabs-hide
#fragment-11.ui-tabs-panel.ui-tabs-hide
#fragment-12.ui-tabs-panel.ui-tabs-hide
#fragment-13.ui-tabs-panel.ui-tabs-hide
#fragment-14.ui-tabs-panel.ui-tabs-hide
#fragment-15.ui-tabs-panel.ui-tabs-hide
%p The end.
的代碼是，它創造了正確的選項卡界面精美，但是按鈕不起作用，他們只是出現作爲文本，所以我想知道是否有什麼我應該做的，以使JavaScript正常工作？我試圖在HAML文件中刪除javascript代碼，並把它的application.js：
// This is a manifest file that'll be compiled into including all the files listed below.
// Add new JavaScript/Coffee code in separate files in this directory and they'll automatically
// be included in the compiled file accessible from http://example.com/assets/application.js
// It's not advisable to add code directly here, but if you do, it'll appear at the bottom of the
// the compiled file.
//
//= require jquery
//= require jquery_ujs
//= require_tree .
$(function() {
var $tabs = $('#tabs').tabs();
$ (".ui-tabs-panel").each(function(i){
var totalSize = $(".ui-tabs-panel").size() - 1;
if (i != totalSize) {
next = i + 2;
$(this).append("Next Page »");
}
if (i != 0) {
prev = i;
$(this).append("« Prev Page");
}
});
$('.next-tab, .prev-tab').click(function() {
$tabs.tabs('select', $(this).attr("rel"));
return false;
});
});
這不僅造成了標籤佈局斷裂，無法繼續正常工作。