javascript - RequireJS Ajax 被调用过多

Question

在rails服务器上运行，当我通过提交表单进行ajax调用时，表单会经过3次。这张图显示了 3 次失败，但是无论失败还是成功，都会运行 3 次。

当我拿走时:

require(['/assets/monitor/monitor'], function(Monitor){
    var monitor = new Monitor();
    monitor.initial();
});

它完全停止工作。当我只带走时:

var monitor = new Monitor();
monitor.initial();

它进行 1 个 ajax 调用。

为什么当我没有调用监视器文件的实例时，ajax 仍然被调用？

main.js

requirejs.config({
    baseUrl: './',
    paths: {
        'jquery': '/assets/monitor/lib/jquery-1.10.2.min',
        'jquery-ui': '/assets/jquery-ui-1.10.2.custom.min',
        'async': '/assets/monitor/lib/async',
        'bootstrap': '/assets/monitor/lib/bootstrap',
        'underscore': '/assets/monitor/lib/underscore',
        'datatables': '/assets/monitor/lib/jquery.dataTables.min',
        'DT_bootstrap': '/assets/monitor/lib/DT_bootstrap'
    },
    shim: {
        'jquery': {
            exports: '$'
        },
            'async': {
                exports:'async'
        },
        'bootstrap': {
                deps: ['jquery']
        },
        'underscore': {
            exports: '_'
        },
        'datatables': {
            deps: ['jquery']
        },
        'DT_bootstrap': {
            deps: ['datatables']
        }
    }
});
require(['/assets/monitor/monitor'], function(Monitor){
    var monitor = new Monitor();
    monitor.initial();
});

monitor.js

define(['jquery', 'async', 'bootstrap'], function($, async, jQuery) {

    var Monitor = function() {};
    // Kicks off the file
    Monitor.prototype.initial = function () {
        var hostname = 'http://somehostthatworks';
        var portNumber = 'some port that works';
        var contentType = 'JSON';
        var versionNumber = '1.1';
        this.receiveMonitor(hostname, portNumber, contentType, versionNumber);
    };
    ...
    Monitor.prototype.recieveMonitor = function(hostname, portNumber, contentType, versionNumber) {
        $("form").submit(function () {
           //Some ajax that works when form is submitted.
        });
    };
    ...
});

application.js

// Call requireJS and main.js
//= require ./monitor/lib/require
//= require ./monitor/main

Answer 1

通过将对 require.js 和 main.js 的调用移出 application.js 并移至我需要它们的页面(好的调用是 monitor.html.erb)，我能够停止重复。

monitor.html.erb

...
<% @stylesheetIncludes= ["bootstrap.min", "jquery-ui-1.10.2.custom.min", "monitor", "jquery.dataTables.min"] %>
<% @javascriptIncludes= ["monitor/lib/require", "monitor/main"] %>
<!-- Monitor Service -->
<%= render 'monitor/monitorService' %>
...