我有一个应用程序,我在其中显示来自服务的项目.在这里,我有大约200个项目要显示,这是一些很难看到的.
在这里,我想显示加载更多功能,通过显示前20和点击加载更多它将显示下一个20,依此类推.如果有人有想法,我无法找到如何实现这一点的方法请帮帮我.
我正在尝试使用phonegap应用程序,但我不知道如何构建体系结构.
我尝试了一种带有大js的MVC模型用于控制器,带有ajax请求的js文件从服务器(模型)获取信息.
对于视图,我使用带有标题和头部的主要布局.
我使用JQuery中的load更新我的内容.
我使用这个系统有一些问题,例如前一个按钮关闭应用程序,因为我总是使用相同的页面.当我旋转屏幕时,我回到第一个屏幕,因为页面正在刷新.
我想知道你是否有一些解决方案或一些代码样本以良好的基础开始
谢谢
architecture model-view-controller android jquery-mobile cordova
我有以下html,
http://jsfiddle.net/2bWfL/168/
<head>
<title>My Page</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.0/jquery.mobile-1.3.0.min.css" />
<script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
<script src="http://code.jquery.com/mobile/1.3.0/jquery.mobile-1.3.0.min.js"></script>
</head>
<body>
<div data-role="page">
<div data-role="header">
<h1>My Title</h1>
</div><!-- /header -->
<div data-role="content">
<ul data-role="listview">
<li>
<a href="#">
<img width="80" height"80" src="http://www.gravatar.com/avatar/7efa2e4098f60c15d230436ca99d7250?s=32&d=identicon&r=PG" />
<h3>New Latest One</h3>
<p>$12,000</p>
<input type="text" style="width:75px"/>
</a>
</li>
</ul>
</div><!-- /content -->
</div><!-- /page -->
<style>
.ui-input-text{
width: 75px;
}
</style>
</body>
但是图像不是垂直居中的.如何让它成为中心？
我已经读过Luke WROBLEWSKI的书"Mobile first"以及关于该主题的许多其他读物.我是一名网络开发人员,现在我确信"移动优先"或"渐进增强"是最佳选择.
现在我正在寻找一个实现这一目标的框架.
JQuery移动annonce他们是"移动第一"但我在某些日子里尝试过,现在我倾向于说"不是不是".你不能把它与其他框架混合在一起; 它确实可以保留DOM中的所有页面(使用ajax强制加载),这样就不会让我的生活更轻松.尝试使用它来逐步增强和完成桌面版本而不卸载它,似乎是不可能的.我的意思是你不想在桌面电脑上放置大按钮,所以我想我只需要删除框架的js和css,这听起来很奇怪.我甚至不知道是否可能.
JQuery mobile看起来像一个框架,可以实现您网站的专用移动网络版本,其外观和感觉不仅仅是移动的第一个网站.
所以请有人告诉我我错在哪里:*jQuery mobile真的是"移动优先"吗？*我可以使用jquery mobile进行渐进增强(使用桌面作为最后一个目标)吗？如果是,请告诉我如何.
以下是相应的页面,告诉jquerymobile首先是移动设备:http://view.jquerymobile.com/1.3.0/docs/intro/#ProgressiveEnhancement
我也尝试了zurb的基础,它运作良好,但没有提供足够的小部件或工具来提供漂亮的mobiel UI.混合两者将是重点,但它需要很多工作(CSS冲突+可能是JS冲突),我甚至不知道它是否可能.
有关如何在移动第一个上下文中使用jquery mobile的任何建议都将受到欢迎!
我正在尝试使用数据类型"对话框"来获取一个div,以便在JQuery Mobile中显示,由Javascript事件触发.下面示例中的按钮单击纯粹是为了触发事件.
<head>
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.1/jquery.mobile-1.2.1.min.css" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script type="text/javascript" src="http://code.jquery.com/mobile/1.3.0/jquery.mobile-1.3.0.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
//$.mobile.changePage('#addCatForm');
$('#createEvent').click (function () {
console.log('Prove event fired');
$.mobile.changePage('#addCatForm', {
transition: 'pop',
changeHash: false,
role: 'dialog'
});
});
});
</script>
</head>
<body>
<div data-role="page" id="mainPage">
<button id="createEvent">Create Event</button>
<div data-role="dialog" id="addCatForm" data-theme="c">
<p>here is some text</p>
<div data-role="content">
<input type="text" id="catText" data-theme="c"/>
<input data-role="button" data-mini="true" data-theme="b" data-inline="true" type="submit" id="addCat" value="Add Category">
<button data-role="button" data-mini="true" data-theme="c" data-inline="true" id="canCat">Cancel</button>
</div>
</div>
</div>
</body>
console.log输出正确触发,但我无能为力似乎要显示对话框.
任何帮助赞赏.
谢谢,
在jquery mobile中的页面之间传递参数的正确方法是什么.在jquery mobile的Q&A中,有一些关于插件的建议.这是强制性的吗？请让我知道正确的方法.没有一个具体的答案.我必须传递页面中所有链接的参数.
http://view.jquerymobile.com/master/demos/faq/pass-query-params-to-page.php
我试图显示页面加载小部件,直到页面完全加载,之后它应该隐藏...并且每次我打击任何锚点传输到下一页时执行此过程..
支持我有三页......
<div data-role="page" id="home">....</div>
<div data-role="page" id="about">....</div>
<div data-role="page" id="contact">....</div>
我正在使用的脚本: -
$(document).on("pagecreate", function(event) {
//alert("Take It Show");
$( ".ui-loader" ).loading( "hide" );
});
是否可以添加转换像data-transition="slide"任何锚或data-ajax="false"在其中使用... ??
我正在为android创建一个HTML5应用程序.
我正在使用jQuery mobile以及以下标题:
<link rel="stylesheet" href="../../lib/jquery.mobile-1.3.0.min.css" />
<script src="../../lib/jquery-1.8.2.min.js"></script>
<script src="../../lib/jquery.mobile-1.3.0.min.js"></script>
然后按照jQuery mobile的演示站点中的描述添加输入字段:
<input type="date" data-clear-btn="false" name="date-1" id="date-1" value="">
但是,我只是得到一个文本框而不是datepicker.
我错过了什么吗？
所以,标题是不言自明的.我正在尝试使用jQuery mobile和Handlebars,但我遇到了表格的CSS或者车把生成的列表视图的问题.似乎CSS被忽略了.
编辑:这是一个实际的实例:http://jsbin.com/adurar/1/edit
在本<head>节中,我有以下代码:
<script id="articles-template" type="text/x-handlebars-template">
<ul data-role="listview" data-autodividers="true" data-filter="true" data-inset="true">
{{#entries}}
<li><a href="#" onClick="">{{msg}}</a></li>
{{/entries}}
</ul>
</script>
HTML的主体是非常直接的jquery移动:
<div data-role="page" data-theme="b">
<div data-role="header">
<h1>Page Title</h1>
</div><!-- /header -->
<div data-role="content">
<p>
<div id="articleHandlebars" data-demo-html="true"></div>
</p>
</div><!-- /content -->
<div data-role="footer">
<h4>Page Footer</h4>
</div><!-- /footer -->
</div><!-- /page -->
在.js文件中我有这个代码:
function showData(data)
{
var source = $("#articles-template").html();
var template = Handlebars.compile(source);
var html = template(data);
$("#articleHandlebars").html(html);
}
我也尝试添加这个无济于事:
$("#articleHandlebars").trigger('create');
$("#articleHandlebars").listview('refresh');
非常感谢任何形式的帮助!
markup jquery jquery-mobile handlebars.js jquery-mobile-listview
在android中我们有layout_weight和layout_height来设置图像/布局的宽度和高度.所以当我们有不同的屏幕尺寸时,它会自动调整到我们指定的屏幕宽度和屏幕高度.
他们的东西在phonegap/jquery手机中是否与它类似？
我想要一个页眉和页脚以及介于两者之间的图像.我尝试在CSS中添加标头.但图像在标题中重复,整个屏幕也可以滚动,但我想在屏幕上找到一个固定的图像,我想让图像自动调整到设备的屏幕尺寸.我是phonegap和jquery mobile的新手.
如何在页眉和页脚之间固定图像并自动调整到不同的屏幕尺寸？
这是html页面
<div data-role="page" id="timer">
<div data-role="header" data-position="fixed" data-tap-toggle="false" class="timerheader">
<h1></h1>
</div>
<div data-role="content">
<p><centre><img src="Image/timer.png" alt="" /></centre></p>
</div>
<div data-role="footer" data-position="fixed" data-tap-toggle="false" >
<h3><a href="#" data-role="button" data-inline="true" ><img src="Image/Next.png"/></a></h3>
</div>
</div>
谢谢:)
jquery-mobile ×10
jquery ×9
android ×3
cordova ×3
css3 ×3
javascript ×3
html5 ×2
architecture ×1
listview ×1
markup ×1
mobile ×1
setinterval ×1