如何从JQuery函数调用JS文件?

时间:2012-03-12 04:26:05

标签: jquery jquery-mobile

我在jQuery中有一个函数,我希望在触发该函数的地方,应该在该特定事件上调用我的一个JS文件。

我尝试过以下但是没有用。

$.getscript 

如何在jQuery中加载JS文件?

事情是我有一个页面通过ajax调用webservices并且我正在使用Grid来显示。我在网格中有编辑按钮。当用户按下编辑按钮时,我想要选择一个选项卡(输出到四个)..所以我需要调用Tab.js才能转到特定选项卡。这是标签代码..等我正在编辑我的帖子的代码

标签代码

(function($, undefined ) {
$.widget( "mobile.tabs", $.mobile.widget, {
options: {
    iconpos: 'top',
    grid: null,
    load: function(event, ui) { },
    beforeTabHide: function(event, ui) { },
    beforeTabShow: function(event, ui) { },
    afterTabShow:  function(event, ui) { }
},
_create: function(){
    var
        $this = this,
        $tabs = this.element,
        $navbtns = $tabs.find("a"),
        iconpos = $navbtns.filter('[data-icon]').length ? this.options.iconpos : undefined;
    var $content = $tabs.closest('div[data-role="page"]').find('div[data-role="content"]');

    $tabs
        .addClass('ui-navbar')
        .attr("role","navigation")
        .find("ul")
            .grid({grid: this.options.grid });

    if( !iconpos ){ 
        $tabs.addClass("ui-navbar-noicons");
    }

    $navbtns
        .buttonMarkup({
            corners: false,
            shadow:  false,
            iconpos: iconpos
        })
        .removeClass('ui-link');

    // Set up the direct children of the page as the tab content, hide them
    $content.children().addClass('ui-tabs-content');

    // Now show the one that's active
    if( $navbtns.filter('.ui-btn-active').length == 0 )
        $navbtns.first().addClass('ui-btn-active');
    $content.children('#' + $navbtns.eq($this.currentTab()).attr('href')).addClass('ui-tabs-content-active');

    $navbtns.bind('click', function(event) {
        navButtonClick.call(this, event);
        return false;
    })
    .bind('tap', function(event){
        navButtonClick.call(this, event);
        return false;
    });

    function navButtonClick(event) {
        $navbtns.removeClass( "ui-btn-active" );
        $( this ).addClass( "ui-btn-active" );
        $this.changeTab(event, {
            currentTab: $navbtns.eq($this.currentTab()),
            nextTab: $(this),
            currentContent: $this.currentContent(),
            nextContent: $content.children($(this).attr('href'))
        });
        event.preventDefault();
    }

    this._trigger('load', null, {
        currentTab: $navbtns.eq($this.currentTab()),
        currentContent: $this.currentContent()
    });
},
currentTab: function() {
    var $tabs = this.element,
    $navbtns = $tabs.find("a");
    return this.element.find('.ui-btn-active').parent().prevAll().length;
},
currentContent: function() {
    return this.element.closest('div[data-role="page"]').find('div[data-role="content"]').children().filter('.ui-tabs-content-active');
},
changeTab: function(event, ui) {
    if( this._trigger('beforeTabHide', event, ui) )
        ui.currentContent.siblings().andSelf().removeClass('ui-tabs-content-active');
    if( this._trigger('beforeTabShow', event, ui) )
        ui.nextContent.addClass('ui-tabs-content-active');
    this._trigger('afterTabShow', event, $.extend({}, ui, { previousContent: ui.currentContent, currentContent: ui.nextContent, nextContent: null }));
}
});
})( jQuery );

$('[data-role=page]').live('pagecreate', function(e) {
$(this).find('[data-role="tabs"]').tabs();
});

3 个答案:

答案 0 :(得分:1)

变量区分大小写。尝试:

$.getScript

答案 1 :(得分:1)

使用Google分析示例,我建议您在关闭<body>标记前添加:

 <script type="text/javascript">
   var url = 'http://example.com/script.js';
   document.write(unescape("%3Cscript src='" + url + "' type='text/javascript'%3E%3C/script%3E"));
 </script>

我假设你需要这样的东西:

$('#editBtn').click(function() {
   var url = '/js/Tabs.js';
   document.write(unescape("%3Cscript src='" + url + "' type='text/javascript'%3E%3C/script%3E"));
});

答案 2 :(得分:0)

如果你想让javascript嵌入内联,以便'this'指向调用该事件的对象,那么我就不知道了。

但是要运行外部JS文件,您可以通过编程方式将另一个“”附加到文档中。