Question

我正在使用基金会站点v6.5.1。

我的设置说明：

我正在这样的基金会中导入main.js文件。

import $ from 'jquery';

import whatInput from 'what-input';

window.$ = $;

import Foundation from 'foundation-sites';

Foundation.addToJquery(jQuery);

$(document).foundation();

import motionUI from 'motion-ui';


import fDatepicker from 'foundation-datepicker';

import custom from './custom.js';

该文件使用gulp编译：

function scripts(cb){
    return browserify({
        entries: js.entrySrc
    })
        .transform( babelify, { presets: [ '@babel/preset-env' ] } )
        .bundle()
        .pipe( source(js.src) )
        .pipe( rename( {
            extname: '.min.js'
        } ) )
        .pipe( buffer() )
        .pipe( gulpif( production, stripDebug() ) )
        .pipe( gulpif( !production, sourcemaps.init({ loadMaps: true }) ) )
        .pipe( gulpif( production, uglify() ) )
        .pipe( sourcemaps.write( '.' ) )
        .pipe( gulp.dest( js.dest ) )
        .pipe( notify ({ message: 'Assets compiled!' }) )
        .pipe( browserSync.stream(), cb );
}

这一切都按预期进行。

我将jquery作为依赖项在Wordpress中排队。 WordPress按此顺序加载它：

jquery
main.js
3rdparty.js

问题出在单独的3rdparty.js文件上。

我正在使用一些基础事件来操纵某些元素。例如：

$('#testing').on('down.zf.accordion up.zf.accordion', function() {
        console.log('open');
    });

现在的问题是，在3rdparty.js中使用时，事件不会触发。

直接在main.js中使用，或者与custom.js文件一起使用和导入时，它们可以很好地工作。

要使其在custom.js中运行，我必须以

开头

import $ from 'jquery';

$(document).ready(function custom() {...

尽管已经在main.js中这样做，否则事件不起作用。

但是，当我使用CDN作为基础并将其直接排入Wordpress时，事件起作用，因此顺序为：

jquery
foundation.js
main.js
3rdparty.js

现在最大的问题是，为什么事件不在3rdparty.js中触发？

基础站点：在单独的.js文件中使用时，事件不起作用

0 个答案: