草庐IT

single-page-application

全部标签

javascript - 在 pushState 单页应用程序中将 URL 片段 (#) 用于模态视图

我们在pushstate-only模式下使用Backbone.Router,因此我们所有的客户端路由都是无哈希的。但是,我们在应用中实现模态视图时遇到了困难。挑战如下:我们希望后退按钮隐藏当前模态视图(因此我们需要它有一个URL);我们希望Forward在不重绘整个应用程序的情况下再次显示它;我们希望能够在任何现有路线“之上”显示模式,而不仅仅是在一个页面上;我们希望能够创建立即显示特定模式(例如登录模态视图)的链接。换句话说,我们希望模态视图在历史中呈现。我们的第一次尝试是使用像/login这样的URL作为登录模式,并在route处理程序中专门处理它们。当我们在/otherpage上

javascript - Chrome 扩展 : identify web requests of background-page iframe?

我正在编写一个Chrome扩展程序,它会代表用户定期检查网页。为了不引人注目,该页面被加载到扩展程序隐藏背景页面上的iframe中。是否可以仅识别此iframe发出的网络请求?我最初的实验(见下文)似乎表明这很棘手。获取特定选项卡的所有Web请求很容易:您拥有tabId,并且可以使用该tabId过滤Web请求(通过WebRequestAPI)。但是对于后台页面iframe,不清楚“tabId等效”标识符是什么,或者如何使用它来过滤Web请求。有什么想法吗?我最初的实验细节如下。frameId值看起来很有希望,但我不认为它在扩展程序中是唯一的。此问题已针对Firefox提出:Identi

javascript - 按顺序打开 Angular 应用程序页面 - 第二个 page.open 回调不会被调用

我正在尝试依次打开2个Angular应用程序页面,以使用phantomjs获取它们的屏幕截图。第1页需要在第2页之前打开,因为它为第2页准备了一些数据。我正在使用两个嵌套的setTimeout()函数,方法如下:varpage=require('webpage').create(),t,url;phantom.addCookie({'name':'token','value':'','domain':'localhost'});t=Date.now();url="http://localhost:8000/#/page1";page.onConsoleMessage=function(

javascript - Polymer core-animated-pages 默认页面

我正在使用Polymercore-animated-pages在我的网站主页之间切换。我通过的id来选择需要显示的页面.您可以查看实际示例here.现在,我遇到的问题是在加载页面时,应该选择的页面是从url加载的,例如www.example.com/home显示主页,www.example.com/activities显示事件页面(示例中省略的代码,因为不是很相关)。但是链接提供的id不存在怎么办?是否有显示默认值的选项core-animated-pages-带有404消息的页面?或者我是否必须检查每个链接是否在我所有页面的数组中,如果是,则手动加载错误页面并显示正确的页面?同样,这里

javascript - 在浏览器上前后保持应用过滤器 Angular 2

我有产品列表页面,我确实有所有数据显示给用户,如果用户正在应用过滤器,我会使用Angular2在客户端本身过滤列表,现在,如果用户前进到项目详细信息页面并单击浏览器后退按钮,所有应用的过滤器都会消失,但我需要实现,以便在后退按钮上所有应用的过滤器都应该保留。我想到的解决方案:-方法:每当用户应用过滤器时,我们都会将其添加到URL中并重定向。问题:在每个URL上都会调用重定向API。有没有更好的方法可以解决这个问题? 最佳答案 将内容作为参数存储在URL中是一种很好的方法,因为您不依赖于隐藏状态(全局应用程序变量)来构建View。但是

javascript - react /nextJS : How to debug different nodes of SSR react application?

我正在运行一个运行SSR的nextJS应用程序。但是我确实得到了错误:Warning:DidnotexpectserverHTMLtocontainain.因此服务器端和客户端Node之间似乎存在差异。我怎样才能找到这些差异?这是示例应用程序的代码库:https://github.com/jaqua/nextjs-app只需运行npminstall和npmrundev 最佳答案 根据页面大小,手动比较两个html可能相当麻烦,因此建议首先评估可能出现的错误,而不是暴力破解。根据我在99%的情况下的经验,当您执行以下操作时,会发生SS

javascript - 带有 application/xml+xhtml 内容类型的 Dojo

如何让DojoDijits(目前为1.5.0)以application/xml+xhtml的形式使用XHTML?如果作为text/html发送,它可以工作,但需要application/xml+xhtml。这似乎与dijit.form.DatePicker和其他几个有关。这不是针对W3C进行验证的问题,它根本不起作用,根本。Error:mismatchedtag.Expected:.SourceFile:Line:5,Column:54SourceCode:>JavaScript执行因该错误而停止。显然,我可以重新编译Dojo,并单独修复所有这些问题,但这需要大量工作,并且无法修复所有

javascript - Grunt 配置监视和 karma :unit in single task

目前我有两个独立任务的Gruntfile配置,它工作得很好:grunt.registerTask('server',['connect','jshint','less:dev','watch']);grunt.registerTask('test',['karma:unit']);我想完成一项涵盖两件事的任务并登录到一个终端窗口。像这样的东西:grunt.registerTask('dev',['connect','jshint','less:dev','karma:unit','watch']);问题是karma和watch不能一起工作。我尝试将karma:unit:run放入wat

javascript - Chrome 扩展 : Storing variables for a tab even if page changes

我正在构建一个Chrome扩展程序。我想知道即使页面发生变化,是否有一种方法可以记住选项卡的js变量。例如。如果我在example1.com上并在同一个选项卡上转到example2.com,我应该保留在example1.com上设置的变量。我不想使用Chrome存储空间。我不能使用localStorage或sessionStorage,因为chrome对不同的域有不同的存储。这可以通过哪些方式实现? 最佳答案 除了使用localStorage(通过后台页面)之外,您还可以通过从内容脚本向后台页面发送消息,将这些变量直接保存在后台页面

javascript - D3 : How to handle zooming and tooltips in a single chart?

我有一个可视化效果,它本质上是一系列堆叠条形图,每个条形图都包含几个面板。例如,here是三个这样的条形图,每个都有四个面板。我已经设法实现了跨图表协调的平移/缩放功能。This例如,如果我从最后一张图像放大到第三个面板,它会是什么样子。从放置在每个图表上的不可见矩形调用缩放行为。我的问题是我想根据用户光标在绘图中的位置启用工具提示功能。然而,由于缩放矩形位于图表的顶部,因此实际图表本身中的任何SVG元素都没有注册任何鼠标事件。有人知道解决这个问题的方法吗? 最佳答案 我正在关注MikeBostock'sexample,就像你在我的