Question

我正在尝试从一个js文件加载以下所有脚本。如果在body标记之前插入，则所有片段都有效，但如果插入到一个js文件中则不起作用。

串联可能是错误的，但我对js一无所知。我该怎么做才能将所有文件放在一个文件中？

// Profile flip
$('#pm-flip').click(function () {
    $('#flip-card').toggleClass('rotated');
});


// TinyScrollBar
$(document).ready(function () {
    $('#scrollbar-two').tinyscrollbar();
});


// popover and tooltip for rel element 
/* Tooltips */
$.fn.tooltip && $('[rel="tooltip"]').tooltip();
/* Popovers */
$.fn.popover && $('[rel="popover"]').popover();


// footable table init 
$(function () {
    /* FooTable */
    if ($('.footable').length) $('.footable').footable();
});

//select picker init 
$('.selectpicker').selectpicker();


// Tooltip Btn grp fix 
$('.btn-group [title]').tooltip({
    container: 'body'
})

// Twitter plugin

// ##### Twitter Setting #####
// A simple example to get my latest tweet and write to a HTML element with
// id "tweets". Also automatically hyperlinks URLS and user mentions and
// hashtags.
// Change the number below as per your Twitter Widget ID. 
// You need to create your Widget from your twitter account
// Chnage the number 3 to the number of tweets that you want to display
twitterFetcher.fetch('3914079076786768776', 'example1', 3, true);

//Twitter plugin-->

// Lodaing state for buttons -->

$('button[data-loading-text]')
    .click(function () {
    var btn = $(this)
    btn.button('loading')
    setTimeout(function () {
        btn.button('reset')
    }, 3000)
});


//ScrollUp
$(function () {
    $.scrollUp({
        scrollName: 'scrollUp', // Element ID
        topDistance: '300', // Distance from top before showing element (px)
        topSpeed: 300, // Speed back to top (ms)
        animation: 'slide', // Fade, slide, none
        animationInSpeed: 400, // Animation in speed (ms)
        animationOutSpeed: 400, // Animation out speed (ms)
        scrollText: 'Scroll to top', // Text for element
        activeOverlay: false, // Set CSS color to display scrollUp active point, e.g '#00FFFF'
    });
});


// icon switch fix -->

$('#target-col').on('show hide', function (e) {
    if ($(e.target).attr("id") != "target-col") return;
    $('#target-shown').toggleClass('icon-arrow-up icon-arrow-down', 200);
});

// icon switch fix -->

// Tooltip on a attribute -->

jQuery(function ($) {
    $("a").tooltip({
        html: true,
        container: 'body'
    });
});


// Tooltip Btn grp fix -->

$('.btn-group [title]').tooltip({
    container: 'body'
})

// Tooltip Btn grp fix -->

Answer 1

我修复了代码中的所有问题。将以下内容粘贴到文件中，并确保它低于所有其他javascript文件，顺序很重要。

$(document).ready(function() { 

           // Profile flip
            $('#pm-flip').click(function() {
            $('#flip-card').toggleClass('rotated');
            });


            // TinyScrollBar
            $(document).ready(function(){
              $('#scrollbar-two').tinyscrollbar();
            });


            // popover and tooltip for rel element 
            /* Tooltips */
            $.fn.tooltip && $('[rel="tooltip"]').tooltip();
            /* Popovers */
            $.fn.popover && $('[rel="popover"]').popover(); 


            // footable table init 
            $(function()
            {
                /* FooTable */
              if ($('.footable').length) {
                  $('.footable').footable();
                }
            });

            //select picker init 
            $('.selectpicker').selectpicker();


            // Tooltip Btn grp fix 
            $('.btn-group [title]').tooltip({
              container: 'body'
            });

            // Twitter plugin

            // ##### Twitter Setting #####
            // A simple example to get my latest tweet and write to a HTML element with
            // id "tweets". Also automatically hyperlinks URLS and user mentions and
            // hashtags.
            // Change the number below as per your Twitter Widget ID. 
            // You need to create your Widget from your twitter account
            // Chnage the number 3 to the number of tweets that you want to display
               twitterFetcher.fetch('3914079076786768776', 'example1', 3, true);

            //Twitter plugin-->

            // Lodaing state for buttons -->

            $('button[data-loading-text]').click(function () {
                    var btn = $(this);
                    btn.button('loading');
                    setTimeout(function () {
                        btn.button('reset');
                    }, 3000);
                });


             //ScrollUp
            $(function () {
            $.scrollUp({
            scrollName: 'scrollUp', // Element ID
            topDistance: '300', // Distance from top before showing element (px)
            topSpeed: 300, // Speed back to top (ms)
            animation: 'slide', // Fade, slide, none
            animationInSpeed: 400, // Animation in speed (ms)
            animationOutSpeed: 400, // Animation out speed (ms)
            scrollText: 'Scroll to top', // Text for element
            activeOverlay: false // Set CSS color to display scrollUp active point, e.g '#00FFFF'
            });
            }); 


            // icon switch fix -->

            $('#target-col').on('show hide', function (e) {
                if($(e.target).attr("id") != "target-col") { 
                     return;
                 }

                $('#target-shown').toggleClass('icon-arrow-up icon-arrow-down', 200);
            });

            // icon switch fix -->

            // Tooltip on a attribute -->

                jQuery(function ($) {
                    $("a").tooltip({ html : true, container: 'body'});
                });


            // Tooltip Btn grp fix -->

            $('.btn-group [title]').tooltip({
              container: 'body'
            });

            // Tooltip Btn grp fix -->

});

Answer 2

您在代码中遇到一些语法错误。要先修复它们，你最好更改这部分：

$.fn.tooltip && $('[rel="tooltip"]').tooltip();

还有这个：

$.fn.popover && $('[rel="popover"]').popover();

他们可能应该是这样的：

if($.fn.tooltip) $('[rel="tooltip"]').tooltip();
if($.fn.popover) $('[rel="popover"]').popover();

你遇到的另一个问题是这部分：

animationOutSpeed: 400, // Animation out speed (ms)
scrollText: 'Scroll to top', // Text for element
activeOverlay: false,

将其更改为

animationOutSpeed: 400, // Animation out speed (ms)
scrollText: 'Scroll to top', // Text for element
activeOverlay: false

我刚删除了代码中的最后一个'，'并且它有效。

自定义jquery init脚本优化

2 个答案: