RequireJS Ajax被调用得太多了

时间:2013-07-26 00:54:26

标签: javascript ajax requirejs

在rails服务器上运行,当我通过提交表单进行ajax调用时,表单会经历3次。这张照片显示3失败但无论是失败还是失败,都会跑3次。 enter image description here

当我带走时:

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

1 个答案:

答案 0 :(得分:0)

通过将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' %>
...