2015年10月1日至10月25日，两个本科生和一位研究生以及一位老师组成四人团队，开发某教育前端项目

所遇问题总结以及分享：

一、主要应用软件：sublime_text HBuilder

初学者可以在JQuery mobile的Demo中寻找代码（可以看图找代码仿写）

1.回退按钮设置： <a href="javascript:history.back(-1);" style="background:none;box-shadow:none;border:none;" data-ajax="false"><img src="img/arrow.png" id="img_arrow"></a>

效果图：

加上style的属性即可，去掉加载图片的背景颜色,前提是PS时将图片设置成透明背景

遇到分隔线的情况：

可以类似，使用两个div去分隔开，比使用margin-top或直接加入图片的方法更为简单

<div class="ui-grid-c" >
<div class="ui-block-a"><span></span>
<br><span >超越全校学生</span></div>
<div class="ui-block-b"><span></span>
<br><span >超越全市学生</span></div>
<div class="ui-block-c"><span ></span>
<br><span></span></div>
<div class="ui-block-d"><span> </span>
<br><span></span></div>
</div>

2.文字缩放问题：</html>之后加上
加上jQuery.fontFlex.js文件
头部加上：
<script src="js/jQuery.fontFlex.js"></script>

</html>之后加上 :
<script type="text/javascript">
$(function() {
// All elements
$('body').fontFlex(10, 18, 30);
$('#img_arrow').fontFlex(10 , 30, 70);
// H1 only
$('h1').fontFlex(15, 40, 60); });
</script>

加上javascript的脚本即可解决文字随浏览器大小自动改变

3.ExamCompare中绘图多次渲染解决方案
网址：
http://www.4byte.cn/question/455962/android-webview-html5-canvas-error.html

4.页面跳转问题加上data-ajax="false"
<a href="javascript:history.back(-1);" style="background:none;box-shadow:none;border:none;" data-ajax="false">
网址：
http://zhidao.baidu.com/link?url=GgSKh384-vVFvUDrL3UlPiL7OmVdLo5rOAQBwiyzabn4WhtogYFoNRHTMbrdcak_qFO6izpYADo5D9_DalxWP7RHy5Qr2Uqbf5mnaB7Lujy

页面跳转时应该加上data-ajax="false"，否则计算机上浏览器可以完美返回，到手机端着无法实现返回功能

5.alert在手机中改为无法被识别必须改为confirmJQM
JS文件夹中加入JQuery.Alert.js文件
<head>中加上：
<script src="js/JQuery.Alert.js"></script>

附件为用jquery写的提示框代码，请将此JS文件放入到js文件夹，并在head部分声明引用。
其后即可将每个javascript中出现的alert 替换为confirmJQM即可。

alert只能在计算机中实现，到在手机端中必须将alert改为confirmJQM

WebApp的前端所遇问题的更多相关文章

  1. webapp项目前端总结

    提纲 整体把握,从设计稿入手——技术选型 并行开发,从实现静态页面开始 前端自动化 前端js逻辑 前后端集成 小问题集合 总结 1.整体把握,从设计稿入手 —— 技术选型 新项目到手,算是运气好,设计 ...

  2. 前端--再遇jQuery

    一.属性 属性(如果你的选择器选出了多个对象,那么默认只会返回第一个属性) attr(属性名|属性值) --一个参数是获取属性的值,两个参数是设置属性值 --点击图片加载示例 removeAttr(属 ...

  3. WebAPP移动前端性能优化规范和设计指导

  4. 【大前端之前后分离01】JS前端渲染VS服务器端渲染

    前言 之前看了一篇文章:@Charlie.Zheng Web系统开发构架再思考-前后端的完全分离,文中论述了为何要前后分离,站在前端的角度来看,是很有必要的:但是如何说服团队使用前端渲染方案却是一个现 ...

  5. 安卓app开发方式之webApp

    1.phonegap: 专注于webapp调用native的功能.2.ionic: 专注于webapp的前端ui技术,需要与phonegap(准确的说是和Cordova配合使用).ionic是一个专注 ...

  6. 使用express， create-react-app， mongodb搭建react模拟数据开发环境

    提要 最近刚刚完成了一个vue的项目,其中涉及的用户数有6000多个以及其他数据也比较多,为了在前端能够真实的进行数据模拟,所有把全量数据拷贝下来放到了api.json中.这样导致整个api.json ...

  7. Java钉钉开发_02_免登授权（身份验证）（附源码）

    源码已上传GitHub: https://github.com/shirayner/DingTalk_Demo 一.本节要点 1.免登授权的流程 (1)签名校验 (2)获取code,并传到后台 (3) ...

  8. 大型NodeJS项目架构与优化

    使用场景: proxy(API冗余,跨域) vue ssr(服务端渲染) socket(大并发,通讯) 区块链(创业公司,新兴行业) 讨论什么? NodeJS异步IO原理及优化方案 NodeJS内存管 ...

  9. Spring+Hibernate+struts2+JPA 注解+跨域//完成手机端点击加载更多 下拉加载更多

    一.使用IDEA新建一个maven项目(student) 1.1.0编写pom文件,添加项目所需要的包 <?xml version="1.0" encoding=" ...

随机推荐

  1. Java可变参数传递中可以接收多个对象

  2. FreeImage使用

    http://blog.csdn.net/byxdaz/article/details/6056509 http://blog.chinaunix.net/uid-20660110-id-65639. ...

  3. C# unmanaged function pointers for iOS

    C# unmanaged function pointers for iOS Just a reminder to myself when I need this thing next time fo ...

  4. 分享jquery实现百叶窗特效的图片轮播

    首先非常感谢网友嘉翼的无私分享,这是他刚在网站扣下来的特效,第一时间与大家分享,jquery实现百叶窗特效的图片轮播 使用方法: 1.引用css文件,css文件里面已经做了注释,基本只需要修改宽高就好 ...

  5. macbook 放flash发烫，转html5

    http://zythum.sinaapp.com/youkuhtml5playerbookmark/

  6. thinkphp succes error跳转模板 设置

    执行成功 换成自己想要的模块 下面的路径是默认的模板\ThinkPHP\Tpl\dispatch_jump.tpl D:\wamp\www\ThinkPHP\Tpl\dispatch_jump.tpl ...

  7. Python之路【第七篇续】：I/O多路复用

    回顾原生Socket 一.Socket起源: socket起源于Unix,而Unix/Linux基本哲学之一就是“一切皆文件”,对于文件用[打开][读写][关闭]模式来操作. socket就是该模式的 ...

  8. 存储过程中的when others then 和 raise

    EXCEPTION when others then rollback; dbms_output.put_line('code:' || sqlcode); dbms_output.put_line( ...

  9. 用Castor 处理XML文档

    ——Castor可以完成Java和XML的相互转换 前面有介绍过json-lib这个框架,在线博文:http://www.cnblogs.com/hoojo/archive/2011/04/21/20 ...

  10. Reachability(判断网络是否连接)

    类似于一个网络状况的探针. [[NSNotificationCenter defaultCenter] addObserver: self selector: @selector(reachabili ...