Tag: mobile

Javascript / Jquery在桌面浏览器中运行速度很快，但在移动/智能手机浏览器中运行速度很慢……我应该拆分我的网站并使用jQuery Mobile吗？

我想让我的网站移动友好。 我理解响应式设计如何使用CSS来帮助解决这个问题，但我发现还有另一个问题。 JQuery，Bootstrap，jQuery UI和jqGrid正在我的网站中使用，并且适用于桌面，但是当从移动设备 （甚至是快速移动设备） 查看网站时 ，它们非常慢 。 根据谷歌开发者的说法 ，使网站移动友好的首选方法是将其保存在一个URL上并使用媒体查询（响应式设计）。 但是这并没有解决我的javascript内容问题。 我是否需要创建一个单独的URL（前面有一个“m”，例如m.website.com），然后使用像jQuery Mobile这样的东西在我的网站上构建每个页面的另一个版本？ 到目前为止，我的测试显示jQuery Mobile似乎在我的智能手机上运行得足够快。 我考虑的另一个选项是重建网站到jQuery Mobile中构建所有页面的地方，但我不认为这是正确的解决方案（ 由JQuery Mobile构建桌面应用程序 ）。 那么，在为移动浏览器提供正确的方法来解决javascript速度问题时，将我的网站拆分并使用jQuery Mobile？ 更新： 我的解决方案是删除jquery-UI和jqgrid。 那些是减速的主要元凶。 而不是jquery-UI，我只是使用单独的jquery插件或根据需要编写自己的插件。 至于jqgrid，我发现了一个具有基本function的良好引导网格，我只是添加了我需要的东西。 我还在使用jquery和bootstrap，但现在移动速度很快！ 我不打算创建一个单独的移动网站，但我只关注每个页面/function的移动设备。 总的来说，我一直在利用引导程序和媒体查询的强大function，让每个页面在移动和桌面上都有一个很好的感觉。 到现在为止还挺好！

Jquery mobile，无法使用$ .mobile.changePage来更改页面

我使用以下代码以编程方式更改我的应用程序中的页面与phonegap： $(‘#selection’).change(function() { alert($(this).val()); $.mobile.changePage($(“#about”), “slideup”); }); 当用户更改选择时，警报将触发，理论上应将它们发送到以下jquery对象。 About Us Information about the company 该对象在正常链接时工作正常 About Us 但我不能让它在浏览器或手机间隙加载程序。 有任何想法吗？ 我必须查找API一百万次。 完整的HTML如下： Header // PhoneGap is loaded and it is now safe to make calls PhoneGap methods // function onDeviceReady() { function reachableCallback(reachability) { // There is no consistency on the format of reachability var networkState […]

在jQuery Mobile上禁用data-role =“header”上的页面转换

是否可以在data-role =“header”上禁用页面转换？ 目标是仅在data-role =“content”处使用页面转换。

DateBox的dateFormat选项不起作用？

我试图让jtsage的jQuery-mobile DateBox插件的dateFormat选项工作。 我在HTML文档中有以下代码： 我的问题分为两部分： dateFormat的值基于以下页面： http ： //dev.jtsage.com/jQM-DateBox/demos/api/dateformat.html 。 我期待选择一个日期，它会显示在dateFormat ，即1月2日，3月29日等。这是正确的，还是应该以不同的方式使用？ 使用此代码，选择日期将产生类似于1/2 / 2012,3 / 29/2012等格式。 我们在数据库中存储的值与我们希望日期选择器显示的值不同，即2012-01-02 => 1月2日，1月2日=> 2012-01-02。 这可能吗？ 提前致谢。

jquery移动和flot库

我正在一个小型的jquery移动框架网站中实现flot。 包含flot的页面/内容div位于辅助页面上。 第一次显示flot页面时，图表呈现得很好。 移回主页面并再次转发到flot页面，图表不会呈现。 内容来自asp mvc视图： $(function () { var d1 = [[1, 1], [2, 2], [3, 3]]; $.plot($(“#chartdiv”), [d1]); });

html5boiler plate + jquery mobile =脚本加载两次

我正在研究一个基于实验jquery移动的应用程序，使用html5样板作为html等的基础。 基本上我到目前为止所做的就是： 下载并解压缩html5样板，并在浏览器中查看。 确保脚本/样式正确加载。 好准备好了。 添加jquery mobile（cdn托管完整版1.0 [今天发布？正确！]） 添加$(document).ready(function () { console.log(‘ready’); }); 刷新。 ‘ready’输出两次..第二个稍微延迟后输出.. wtf烧烤和铬检查员的这种检查情况..通知所有的javascript文件似乎加载两次。 从头开始重新启动，在浏览器中提取h5bp加载，特别注意脚本加载一次。 添加文档就绪处理程序，观察一个’ready’输出。 加载jquery mobile observe脚本加载一次。 将所有脚本移动到标记中。 脚本加载一次。 任何人都知道发生了什么事吗？ 重现这一点应该很容易，只需提取h5bp并将jquery mobile添加到底部的脚本部分，然后突然脚本全部加载两次。 将所有这些脚本移动到modernizr下面（或之前）的head标签中，这不再发生。 谢谢

移动webkit浏览器在JS中有舍入问题吗？

我正在尝试使用移动浏览器上的一些javascript滑块代码调试问题。 它似乎是一个舍入错误，只发生在移动设备上。 以下代码可以在桌面上正常工作（例如Chrome），但在智能手机上的Webkit中查看时，增加按钮无法在滑块上使用更高的值，例如iPhone iOS 5/6，Samsung S2 ICS。 试试这个http://jsfiddle.net/codecowboy/mLpfu/ 。 单击“在移动设备上调试”按钮 – 它与左上角的“运行”按钮直接相邻（您需要登录才能看到此按钮）。 输入在智能手机上的浏览器中生成的URL（最好是iPhone / Android上的webkit浏览器）。 拖动滑块说265，点击增加。 有些值会让你增加，有些则不会。 值越高，问题越严重。 代码使用的是jQuery和noUISlider插件。 按钮点击代码是： var btnIncrease= document.getElementById(“increase”); btnIncrease.addEventListener(‘click’,function(e) { var slider = $(“#noUiSlider”); console.log(e); var value = slider.noUiSlider(‘value’)[1]; //the ‘value’ method returns an array. console.log(‘value pre move ‘+value); value = value+1; slider.noUiSlider(“move”, { knob : 0, to: parseInt(value,10) }); […]

为什么javascript会在我的索尼爱立信C510浏览器上运行，而不是javascript + jquery？

我能够将以下.htm文件复制到我的索尼爱立信C510并且鼠标hover工作： 但我无法使任何jquery工作，例如，当我点击链接时，以下示例没有响应。 我知道jquery-1.4.2.min.js文件存在于正确的位置，因为我复制了目录中的所有文件： $(document).ready(function() { $(“div > div.question”).click(function() { if($(this).next().is(‘:hidden’)) { $(this).next().show(); } else { $(this).next().hide(); } }); }); div.flashcard { margin: 0 10px 10px 0; } div.flashcard div.question { background-color:#ddd; width: 400px; padding: 5px; cursor: hand; cursor: pointer; } div.flashcard div.answer { background-color:#eee; width: 400px; padding: 5px; display: none; } Who was Wagner? German […]

jQuery.on“touchstart mousedown” – 两个事件都在触摸屏设备上触发

我的问题是我无法取消触发touchstart后触发的mousedown事件。 此问题特定于Android的本机浏览器。 Chrome和Safari都在Android和iOS（onMenuInteraction）中成功执行了以下方法。 我的问题似乎仅限于Android的原生浏览器（对我而言，预装了Android 4.1.2）。 以下是我从Javascript对象中提取的代码。 MenuButtonView.prototype.onSmallScreenSetUp = function() { $(“#mobileMenuBtn”).on( { “touchstart mousedown”: $.proxy( this.onMenuInteraction, this ) } ); } MenuButtonView.prototype.onMenuInteraction = function(e) { console.log( this, “onMenuInteraction”, e ); e.stopImmediatePropagation(); e.stopPropagation(); e.preventDefault(); } 请有人告诉我如何取消手指触摸屏幕触发touchstart事件后触发的mousedown事件。 此要求基于管理与桌面和移动/平板电脑平台的交互。 一切正常，直到您使用Android本机浏览器进行测试。 非常感谢 d

如何在*因屏幕方向更改而resize后获取元素*的新尺寸？

我正在开发一个移动网络应用程序，在我的页面中，我有一个div元素，其宽度设置为100％。 我需要设置这个div的高度，以便高度对于设定的宽高比是正确的。 因此，例如，如果屏幕大小为300像素宽且比例为3：2，我的脚本应该抓住div的宽度（此时应该是300px）并将高度设置为200px。 在第一次加载时，这非常有效。 但是，如果我将手机的屏幕旋转到横向， div的宽度会明显改变，所以我需要重置其高度以保持正确的比例。 我的问题是，我找不到在调整元素大小后触发的事件。 jQuery Mobile内置了一个orientationchange事件，当屏幕从纵向旋转到横向时有助于触发，反之亦然： $(window).bind(‘orientationchange’, function (e) { // Correctly alerts ‘landscape’ or ‘portrait’ when orientation is changed alert(e.orientation); // Set height of div var div = $(‘#div’); var width = div.width(); // Shows the *old* width, ie the div’s width before the rotation alert(width); // Set the height of […]