简体   繁体   English

简单的主干应用程序无法正常工作

[英]Simple Backbone app not working

I wrote simple Backbone.js app from manual, but this does't work. 我从手册中编写了简单的Backbone.js应用,但这是行不通的。 Why? 为什么? It is a HTML-code: 这是一个HTML代码:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <link rel="stylesheet" href="main.css">
    <script src="source/jquery.js"></script>
    <script src="source/underscore.js"></script>
    <script src="source/backbone.js"></script>
    <script src="main.js"></script>
</head>
<body>
    <div id="menu"> 
        <ul>
            <li><a href="#!/">Start</a></li>
            <li><a href="#!/success">Success</a></li>
            <li><a href="#!/error">Error</a></li>
        </ul>
    </div>
    <div id="start" class="block">
        <div class="userplace">
            <label>Enter name<input type="text" id="username"></label>
        </div>
        <div class="buttonplace">
            <input type="button" id="button" value="Check">
        </div>
    </div>
    <div id="error" class="block">
        <p>Error - not found!</p>
    </div>
    <div id="success" class="block">
        <p>Win!</p>
    </div>
</body>
</html>

And it is a JS-code: 这是一个JS代码:

var Controller = Backbone.Router.extend({
    routes: {
        '': 'start',
        '!/': 'start',
        '!/error': 'error',
        '!/success': 'success'
    },
    start: function() {
        $('.block').hide();
        $('#start').show();
    },
    error: function() {
        $('.block').hide();
        $('#error').show();
    },
    success: function() {
        $('.block').hide();
        $('#success').show();
    },
});

var controller = new Controller();


var Start = Backbone.View.extend({
    el: '#start',
    events: {
        'click #button': 'check'
    },
    check: function() {
        console.log('WiN!');
        if($("#username").val() == 'test') {
            controller.navigate('success', true);
        }
        else {
            controller.navigate('error', true);
        }
    }
});

var starter = new Start();
Backbone.history.start();

When I select point in menu, all work normal, but when I entered name into field and press button nothing happens. 当我在菜单中选择点时,所有功能都可以正常使用,但是当我在字段中输入名称并按下按钮时,则没有任何反应。 Event not activated. 活动未激活。 Why? 为什么?

I think you're calling navigate incorrectly. 我认为您打来的导航错误。

Try this: 尝试这个:

controller.navigate('!/success', {trigger:true});

Documentation: http://backbonejs.org/#Router-navigate 文档: http : //backbonejs.org/#Router-navigate

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM