Javascript Django：使用框架的外部JS不'；t载荷_Javascript_Python_Django_Phaser Framework_Django Staticfiles

Javascript Django：使用框架的外部JS不'；t载荷

javascript python django

Javascript Django：使用框架的外部JS不'；t载荷,javascript,python,django,phaser-framework,django-staticfiles,Javascript,Python,Django,Phaser Framework,Django Staticfiles,我有这些JS文件，它们使用WAMP服务器在本地主机服务器上运行良好。但是，当我将这些文件放入Django中的模板中时，没有加载任何内容 index.html模板 {% load staticfiles %} <!doctype html> <html lang="en"> <head> <meta charset="UTF-8" /> <title>Phaser - Mak

我有这些JS文件，它们使用WAMP服务器在本地主机服务器上运行良好。但是，当我将这些文件放入Django中的模板中时，没有加载任何内容

index.html模板

{% load staticfiles %}

<!doctype html> 
<html lang="en"> 
<head> 
    <meta charset="UTF-8" />
    <title>Phaser - Making your first game, part 1</title>
    <script type="text/javascript" src="{% static 'game/js/game.js' %}"></script>
</head>

<body>

当我加载页面时：

系统检查未发现任何问题（0静音）。2016年2月15日- 14:19:21 Django版本1.9.2，使用设置“static_test.settings” 在启动开发服务器时退出服务器使用CTRL-BREAK

[15/Feb/2016 14:19:26]“GET/game/HTTP/1.1”200 883

[15/Feb/2016 14:19:27]“GET/static/game/js/game.js HTTP/1.1”200 3439

由于状态代码是200，我认为game.js已经加载，但是由于某些原因game.js中的代码没有执行。当我尝试在index.html中放入一些简单的javascript代码时，它运行得很好。但当我加载game.js时，它什么都没做

有什么想法吗？谢谢大家

如果要在模板中使用

{%static%}

，请确保已正确设置Django以提供静态文件，例如在

settings.py

中未禁用调试（

debug=False

）。另一种方法是通过nginx提供服务，例如，或者将

--unsecure

添加到

manage.py

选项中

要在javascript文件中使用

{%static%}

，请参阅：

因为当你在浏览器中打开javascript控制台时，它只能在.html模板文件中使用，而不能在.js中使用，你看到任何错误吗？

preload

和

create

函数应该由Phaser自动调用，还是你必须自己调用它们？伙计们，我想出来了。我忘了包括相位器库。另一个问题是，现在它运行了，但没有加载资产（ship.png和bullet.png），并且说找不到它。我应该将这些资源放在哪里？您可能需要指定图像的完整url路径，即

/static/game/asset/ship.png

或存储在任何位置。@JohnGordon Awesome！！它起作用了！！非常感谢你

var game = new Phaser.Game(1000, 800, Phaser.AUTO, '', { preload: preload, create: create, update: update });

function preload() {
    game.load.image('e','asset/ship.png');
    game.load.image('b','asset/bullet.png');
    
    game.input.keyboard.addKeyCapture([Phaser.Keyboard.SPACEBAR]);
}
var eSprite;
var bullet;
var cursors;
var key;
function create() {
    
    
    eSprite = game.add.sprite(100,100,'e');
    bullet = game.add.sprite(100,100,'b');
    bullet.visible = false;
    
//    eSprite.scale.setTo(.17,.17);
    game.physics.arcade.enable(eSprite);
    cursors = game.input.keyboard.createCursorKeys();

//    eSprite.body.bounce.y = 0.2;
    eSprite.body.gravity.y = 0;
    eSprite.body.gravity.x = 0;
    eSprite.body.collideWorldBounds = true;
    eSprite.anchor.setTo(0.5, 0.5);
    
//    key = game.input.keyboard.addkey(Phaser.Keyboard.spacebar);
//    key.onDown.fire();
//    add(this.shipBullet.fire,this.bullet);
}

var xGlidePos = 0;
var xGlideNeg = 0;
var yGlidePos = 0;
var yGlideNeg = 0;
function update() {

    if (cursors.left.isDown)
    {
         if(!cursors.up.isDown&&!cursors.down.isDown)
            {
             eSprite.angle = 45;
            }
        
        xGlidePos = 0;
        //  Move to the left
        eSprite.body.velocity.x = -70-xGlideNeg;
        xGlideNeg+=20;  
    
    }
    else if (cursors.right.isDown)
    {
        if(!cursors.up.isDown&&!cursors.down.isDown)
            {
             eSprite.angle = 225;
            }
        xGlideNeg = 0;
        //  Move to the right
        eSprite.body.velocity.x = 70+xGlidePos;
        xGlidePos+=20;

    
    }
    else
        {
         xGlidePos = 0;
            xGlideNeg = 0;
                    eSprite.body.velocity.x = 0;
      
            
        }
    
    if(cursors.up.isDown)
    {
         if(!cursors.left.isDown&&!cursors.right.isDown)
            {
             eSprite.angle = 135;
            }
        
        yGlidePos = 0;
        

        eSprite.body.velocity.y=-70-yGlideNeg;
        yGlideNeg+=20;
    }
    else if(cursors.down.isDown)
        {
            
             if(!cursors.left.isDown&&!cursors.right.isDown)
            {
             eSprite.angle = -45;
            }
            
            yGlideNeg = 0;
            eSprite.body.velocity.y=70+yGlidePos;
            yGlidePos+=20;
        }
    else
        {
   
            eSprite.body.velocity.y = 0;        
           yGlidePos = 0;
            yGlideNeg = 0;
            
        }
    
        if(cursors.up.isDown&&cursors.right.isDown)
            {
                eSprite.angle = 180;
            }
            else if(cursors.right.isDown&&cursors.down.isDown)
            {
                eSprite.angle = 270;
            }
        else if(cursors.down.isDown&&cursors.left.isDown)
            {
                eSprite.angle = 0;
            }
    else if(cursors.left.isDown&&cursors.up.isDown)
            {
                eSprite.angle = 90;
            }
}
    
function shipBullet(shipAngle, shipLocation)
    {
        this.angle = shipAngle;
        this.shipLocation = shipLocation;
    }

    shipBullet.prototype.fire = function()
    {
        this.visible = true;
    };