Question

我从手册中编写了简单的Backbone.js应用程序，但这确实无效。为什么？这是一个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>

这是一个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();

当我在菜单中选择点时，所有工作都正常，但是当我在字段中输入名称并按下按钮时没有任何反应。事件未激活。为什么呢？

Answer 1

我认为你正在调用导航错误。

试试这个：

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

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

简单的Backbone应用程序不工作

1 个答案: