0
切換視圖並返回到另一個視圖。根據觀點的呼籲,事件翻倍n次。查看中樞的重複事件
路由器:
define(function (require) {
"use strict";
var $ = require('jquery'),
Backbone = require('backbone'),
_ = require('underscore'),
LoginView = require('../views/login'),
RecoveryPasswordView = require('../views/recoverypassword');
return Backbone.Router.extend({
routes: {
'': 'onViewLogin',
'recoverypassword': 'onViewRecoveryPassword'
},
onViewLogin: function() {
new LoginView();
},
onViewRecoveryPassword: function() {
new RecoveryPasswordView();
}
});
});
首先查看:
define(function (require) {
"use stritc";
var $ = require('jquery'),
_ = require('underscore'),
Handlebars = require('handlebars'),
Backbone = require('backbone'),
template = Handlebars.compile($('#login-template').html()),
HomeView = require('../views/home'),
Util = require('util');
return Backbone.View.extend({
el: '#app',
events: {
'click #button-login': 'onLogin'
},
ui: function() {
return {
email: this.$('input[name="email"]'),
password: this.$('input[name="password"]')
}
},
initialize: function() {
this.render();
},
render: function() {
this.$el.html(template());
return this;
},
onLogin: function (event) {
if (_.isEmpty(this.ui().email.val())) {
navigator.notification.alert('El Correo electronico es requerido.', null, 'Notificación', 'Aceptar');
return false;
}
if (_.isEmpty(this.ui().password.val())) {
navigator.notification.alert('La contraseña es requerido', null, 'Notificación', 'Aceptar');
return false;
}
if (!Util.regExpEmail().test(this.ui().email.val())) {
navigator.notification.alert('El Correo Incorrecto.', null, 'Notificación', 'Aceptar');
return false;
}
$.getJSON(Util.baseUrl() + 'auth/' + this.ui().email.val() + '/' + this.ui().password.val(), {}, function (response) {
if (response.status == 'success') {
localStorage.user = JSON.stringify({
'id': response.data.intIdUser,
'name': response.data.strUsername,
'email': response.data.strEmail,
'specialty': response.data.intIdSpecialty
});
new HomeView();
} else {
navigator.notification.alert(response.message, null, 'Notificación', 'Aceptar');
return false;
}
});
}
});
});
SECONDO查看:
define(function (require) {
"use stritc";
var $ = require('jquery'),
Handlebars = require('handlebars'),
Backbone = require('backbone'),
template = Handlebars.compile($('#recoverypassword-template').html()),
LoginView = require('../views/login'),
Util = require('util');
return Backbone.View.extend({
el: '#app',
events: {
'click #button-recoverypassword': 'onValidate'
},
ui: function() {
return {
email: this.$("input[type='email']")
};
},
initialize: function() {
this.render();
},
render: function() {
this.$el.html(template());
return this;
},
onValidate: function() {
if (_.isEmpty(this.ui().email.val())) {
navigator.notification.alert('El Correo electronico es requerido.', null, 'Notificación', 'Aceptar');
return false;
}
if (!Util.regExpEmail().test(this.ui().email.val())) {
navigator.notification.alert('El Correo Incorrecto.', null, 'Notificación', 'Aceptar');
return false;
}
$.getJSON(Util.baseUrl() + 'recoverypassword/' + this.ui().email.val(), {}, function (response) {
if (response.status == 'success') {
navigator.notification.alert(response.message, null, 'Notificación', 'Aceptar');
new LoginView();
} else {
navigator.notification.alert(response.message, null, 'Notificación', 'Aceptar');
return false;
}
});
}
});
});
模板:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="format-detection" content="telephone=no" />
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no">
<meta name="apple-mobile-web-app-title" content="DentalProsthetic">
<link href='http://fonts.googleapis.com/css?family=Oxygen:300' rel='stylesheet' type='text/css'>
<link rel="stylesheet" type="text/css" href="public/css/ratchet.css">
<link rel="stylesheet" type="text/css" href="public/css/snap.css">
<script src="cordova.js"></script>
<script src="vendor/ratchet.js"></script>
<script data-main="application/config/app" src="vendor/require.js"></script>
</head>
<body id="app">
<!-- The Templates Login -->
<script type="text/x-handlebars-template" id="login-template">
< div class = "background-blue" > < div class = "content background-blue" > < figure class = "logo" > < img src = "public/images/logo.png" > < /figure> <div class="line-inputs"> <input type="email" name="email" placeholder="Email" required> </div > < div class = "line-inputs" > < input type = "password"
name = "password"
placeholder = "Contraseña"
required > < /div> <button class="button-main button-block" id="button-login" data-ignore="push">Iniciar</button > < span class = "text-row" > < a href = "#recoverypassword"
data - ignore = "push" > ¿Olvidaste tu contraseña ? < /a> </span > < span class = "text-row" > ¿Aún no eres usuario ? < a href = "#register"
data - ignore = "push" > Regístrate aquí < /a> </span > < /div> </div >
</script>
<!-- End Templates Login -->
<!-- The Templates Recovery Password -->
<script type="text/x-handlebars-template" id="recoverypassword-template">
< header class = "bar-title" > < a class = "button back"
href = "#"
data - ignore = "push" > Atras < /a> <h1 class="title">Regístrate</h1 > < /header> <div class="content"> <div class="line-inputs"> <input type="email" name="email" placeholder="Email"> </div > < button class = "button-main button-block"
id = "button-recoverypassword" > Restablecer contraseña < /button> </div >
</script>
<!-- End Templates Recovery Password -->
</body>
</html>
交換視圖或創建新視圖是否存在問題? 意見以來持續保持查看和事件在應用程序上下文:
請只發布相關的代碼,並更具體。 – undefined