[ExtJS5学习笔记]第二十五节 利用window.open()函数实现ExtJS5的登陆页面跳转
本文地址:http://blog.csdn.net/sushengmiyan/article/details/40427543
mvvm方式实现登陆的博客:http://blog.csdn.net/sushengmiyan/article/details/38815923
本文作者:sushengmiyan
------------------------------------------------------------------------------------------------------------------------------------
之前写过一篇文章,是Extjs5MVVM模式下系统登录实例 这文章写完之后,有人就提出了一个疑问,就是每次点击都会弹出登陆这个登陆窗体,想实现登陆之后就不再有登陆窗体这个界面,正因为那个问题于是产生了今天这篇文章。
方法一:官方网站---登陆体验实例:http://docs.sencha.com/extjs/5.0/tutorials/login_app.html 增加一个登陆的标志,根据登陆与否,显示不同的界面
方法二:使用window.open实现网页跳转。
第一步:下载extjs5 http://download.csdn.net/detail/sushengmiyan/7701943
第二步: 创建index.html和app.js,内容如下:
app.js
Ext.application({
name : 'EnterSellSaves',
launch : function() {
Ext.create('Ext.Panel', {
renderTo : Ext.getBody(),
width : 200,
height : 150,
bodyPadding : 5,
title : 'Hello World',
html : 'Hello <b>World</b>...'
});
}
});
index.html
<!DOCTYPE html>
<html>
<head>
<title>欢迎来到 Ext JS!</title>
<link rel="stylesheet" type="text/css" href="ext5/build/packages/ext-theme-neptune/build/resources/ext-theme-neptune-all.css">
<script type="text/javascript" src="ext5/build/ext-all.js"></script>
<script type="text/javascript" src="ext5/build/packages/ext-theme-neptune/build/ext-theme-neptune.js"></script> <script type ="text/javascript" src="app.js"></script>
</head>
<body></body>
</html>
在登陆界面,登陆按钮增加一个函数
onclick="login()"
函数实现如下:
<script type="text/javascript">
function login(){
window.opener = null;
window.open('','_self');
window.close();
window.open('index.html','11','location=0,resizable=no,fullscreen=true,titlebar=no,status=no,toolbar=no,menubar=no,left=0,top=0');
}
</script>
这样就能打开到index,html
对于逻辑判断,就可以更改为jsp啊ASP啊。
这个方法,可以使用sencha cmd生成应用程序框架,也可以使用自己手动引入js文件。感觉还不错。
最终效果---登录页面
登录跳转之后
页面跳转之后,URL也完成了。
[ExtJS5学习笔记]第二十五节 利用window.open()函数实现ExtJS5的登陆页面跳转的更多相关文章
- [ExtJS5学习笔记]第二十四节 Extjs5中表格gridpanel或者表单数据后台传输remoteFilter设置
本文地址:http://blog.csdn.net/sushengmiyan/article/details/39667533 官方文档:http://docs.sencha.com/extjs/5. ...
- [ExtJS5学习笔记]第十五节 Extjs5表格显示不友好?panel的frame属性在作怪
本文地址:http://blog.csdn.net/sushengmiyan/article/details/39057243 sencha官方API:http://docs.sencha.com/e ...
- [ExtJS5学习笔记]第二十九节 sencha ext js 5.1.0中动态更换皮肤主题
本文地址:http://blog.csdn.net/sushengmiyan/article/details/42016107 本文作者:sushengmiyan ------------------ ...
- [EXTJS5学习笔记]第二十六节 在eclipse/myeclipse中使用sencha extjs的插件
本文地址:http://blog.csdn.net/sushengmiyan/article/details/40507383 插件下载: http://download.csdn.net/detai ...
- [ExtJS5学习笔记]第二十节 Extjs5配合数组的push方法,动态创建并加载组件
本文地址:http://blog.csdn.net/sushengmiyan/article/details/39226773 官方例子:http://docs.sencha.com/extjs/5. ...
- Python学习笔记第二十五周(Django补充)
1.render_to_reponse() 不同于render,render_to_response()不用包含request,直接写template中文件 2.locals() 如果views文件中 ...
- [ExtJS5学习笔记]第二十八节 sencha ext js 5.1.0发布版本正式发布 extjs doc下载地址
本文地址:http://blog.csdn.net/sushengmiyan/article/details/41911539 本文作者:sushengmiyan ------------------ ...
- [ExtJS5学习笔记]第十六节 Extjs5使用panel新增的ViewModel属性绑定数据
本文地址:http://blog.csdn.net/sushengmiyan/article/details/39078627 sencha官方API:http://docs.sencha.com/e ...
- [ExtJS5学习笔记]第十四节 Extjs5中data数据源store和datapanel学习
本文地址:http://blog.csdn.net/sushengmiyan/article/details/39031383 sencha官方API:http://docs.sencha.com/e ...
随机推荐
- 【NOIP2009】Hankson 的趣味题
题目描述 Hanks 博士是 BT (Bio-Tech,生物技术) 领域的知名专家,他的儿子名叫 Hankson.现在,刚刚放学回家的 Hankson 正在思考一个有趣的问题. 今天在课堂上,老师讲解 ...
- codeforces 888G Xor-MST
You are given a complete undirected graph with n vertices. A number ai is assigned to each vertex, a ...
- [HNOI2011]任务调度
题目描述 有 N 个任务和两台机器 A 与 B.每个任务都需要既在机器 A 上执行,又在机器 B 上执行, 第 i 个任务需要在机器 A 上执行时间 Ai,且需要在机器 B 上执行时间 Bi.最终的目 ...
- StopAllSounds
10月3日,在杭州市西湖景区,一只小松鼠不停地接受一道道食物,花生.玉米.饼干,可谓来者不拒,憨态可掬的模样吸引了众多围观者...Description 小松鼠开心地在树之间跳跃着,突然她停了下来 ...
- hdu 5521 最短路
Meeting Time Limit: 12000/6000 MS (Java/Others) Memory Limit: 262144/262144 K (Java/Others)Total ...
- hdu 5573Binary Tree
Binary Tree Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/65536 K (Java/Others) Tota ...
- Python中模块之random的功能介绍
random的功能介绍 random模块的方法如下: betavariate 获取一个range(0,1)之前的随机浮点数 方法:random.betavariate(alpha,beta) 返回值: ...
- 谷歌发布 TensorFlow Lite [官方网站,文档]
机器学习社区:http://tensorflow123.com/ 简介 TensorFlow Lite TensorFlow Lite 是 TensorFlow 针对移动和嵌入式设备的轻量级解决方案. ...
- vue学习中v-if和v-show一起使用的问题
v-if和v-show一起使用 在开发项目过程中v-if和v-show一起使用时,接下面跟着的v-else会在页面上面显示两次 .代码如下: <tbody class="sortabl ...
- .eslintrc 文件
安装 建议采用全局安装方式 npm install -g eslint 初始化 如果你的项目还没有配置文件(.eslintrc)的话,可以通过指定–init参数来生成一个新的配置文件: `eslint ...