Tag: JavaScript

哪些浏览器不支持jQuery.ajax的HTTP DELETE？

可能重复： PUT，DELETE，HEAD等方法在大多数Web浏览器中都可用？ jQuery.ajax（）的jQuery文档说明如下： 注意：其他的HTTP请求方法，比如PUT和DELETE，也可以在这里使用，但是并不是所有浏览器都支持。 jQuery本身说它支持IE 6.0+，FF 2+，Safari 3.0+，Opera 9.0+和Chrome。 那么上面哪个（如果有的话）不支持HTTP DELETE？

如何在整个网站上组织大型的JS / jQuery代码库？

你如何组织整个网站的大型JS / jQuery代码库？ 关于如何组织你的代码有很多很好的资源，但没有什么关于如何把它们放在一起，使每一块都适合：侧面广泛的代码组织，多个页面使用相同的代码，保持DRY与松耦合，等等 以下是我如何处理它。 我从来没有像我这样习惯于组织我的代码，因为我认为这是蛮横的，可能导致可维护性/扩展性问题，但是我并不知道更好。 我意识到每个人都有自己的要求，没有交钥匙的解决scheme，但是我很想听到一些关于我做错了什么的意见，为什么我做错了，以及如何写更多的build议可维护的代码。 我想我真的想要： 你如何处理你需要在多个地方，多个页面上使用的逻辑？ 你如何组织页面特定的代码？ 将每个页面命名为全局对象是一个好主意？ 你从一开始就做了什么，以确保随着你的应用越来越大，你不会不断重新编写组织模式？ 我可能在我的第四次迭代写这个东西。 每个页面接收主要的application.js文件。 每个额外的页面都有自己的application.pagename.js文件。 我使用服务器端逻辑来包含文件（首先检查是否存在一个页面 – 有些页面不需要JS），然后按顺序初始化它们。 所以我的主页看起来像： <script src="js/application.js"></script> <script src="js/application.index.js"></script> <script> MyApp.init(); MyApp.index.init(); </script> 我的URL约定是/ page / subpage / id /。 我有大约10页和一大堆子页面，每个子页面都需要自己的逻辑。 看到这篇文章的最后一个例子。 我的大部分代码已经被模块化为jQuery UI小部件或者jQuery插件，所以我会说在这些文件中有75％的代码是require（）一个小部件并启动它。 我使用requireJS来根据需要提取小部件。 // application.js var MyApp = { init: function(){ var self = this; // these widgets are […]

AngularJS CORS问题

我已经search了超过200个网站（可能夸大，但不是太多），如何能够与angularjs处理cors。 我们有一台运行Web API服务器的本地机器。 我们正在开发一个调用API数据的客户端。 从服务器运行客户端时，我们收到的数据没有问题。 当我们从一个不同的域运行它时，我们在获取数据和空白响应时会得到一个红色的200响应。 这里是一些代码： var myApp = angular.module('Project', ['ngResource']); myApp.config(function($routeProvider){ $routeProvider. when('/new', {templateUrl:'templates/new.html', controller:'EditProjectController'}). when('/mobile', {templateUrl:'templates/mobile.html', controller:'ProjectController'}). when('/it', {templateUrl:'templates/it.html', controller:'ProjectController'}). when('/writing', {templateUrl:'templates/writing.html', controller:'ProjectController'}). when('/all', { templateUrl: 'templates/all.html' }). when('/login', { templateUrl: 'partials/_login.html' }). otherwise({ redirectTo: '/all' }); }); myApp.config(['$httpProvider', function ($httpProvider) { $httpProvider.defaults.useXDomain = true; delete $httpProvider.defaults.headers.common['X-Requested-With']; } ]); myApp.controller('ProjectController', function myApp($scope, […]

react.js – 要使用什么扩展名 – “.jsx”或者“.js”？

我只是想弄清楚什么是我的应用程序更好： 使用.jsx扩展，但是我将需要require('MyComponent.jsx'); 使用.js扩展名，这是很好的require('MyComponent); 但是我需要破解Sublime来正确地擦亮它们并突出显示语法。 你有什么经验？

修改尚未创build的元素的首选方式（除了事件）

关于将未来的操作绑定到不存在的元素上 ，有很多问题最终都以现场 /代表来回答。 我想知道如何运行一个任意的callback（例如添加一个类或触发一个插件）到所有匹配select器的现有元素，以及所有未来的元素匹配相同的select器尚未创build。 看起来，livequery插件的主要function使它成为核心，但另一方面，随意的callback在某种程度上迷失了方向。 另一个常见的答案是事件委托，但如果没有访问所有的供应商代码来创build元素来触发事件呢？ 这是一些真实世界的代码： // with livequery $('input[type=text], input[type=password], textarea, .basic_form .block select, .order_form .form_item select, .order_form .form_item input') .livequery(function(){ $(this) .focus(function(){ $(this).addClass('active'); }) .blur(function(){ $(this).removeClass('active'); }) .addClass('text'); }); // with live $('input[type=text], input[type=password], textarea, .basic_form .block select, .order_form .form_item select, .order_form .form_item input') .live('focus', function(){ $(this).addClass('active'); }) .live('blur', function(){ $(this).removeClass('active'); }); […]

React + Flux和服务器端渲染？ （同构反应+通量）

用同构应用程序设置应用程序初始状态的一般做法是什么？ 没有通量我会简单地使用像这样的东西： var props = { }; // initial state var html = React.renderToString(MyComponent(props); 然后通过快速 {{{reactMarkup}}呈现该标记，并通过{{{reactMarkup}} 。 在客户端设置初始状态，我会做这样的事情： if (typeof window !== 'undefined') { var props = JSON.parse(document.getElementById('props').innerHTML); React.render(MyComponent(props), document.getElementById('reactMarkup')); } 所以，基本上你是在服务器和客户端设置了两次状态，不过React会比较差异，在大多数情况下，不会因为重新渲染而影响性能。 如果您在Flux架构中采取行动和存储，这个原则将如何工作？ 在我的组件内我可以这样做： getInitialState: function() { return AppStore.getAppState(); } 但是现在我怎么从服务器设置AppStore的初始状态呢？ 如果我使用React.renderToString没有传递的属性，它会调用AppStore.getAppState() ，它不会有任何东西，因为我仍然不明白我将如何设置我的商店在服务器上的状态？ 2015年2月5日更新 我仍然在寻找一个干净的解决scheme，不涉及使用Fluxible，Fluxxor，Reflux等第三方Flux实现。 2016年8月19日更新 使用Redux 。

在PhoneGap上Angularjs / Javascript应用程序的最佳数据持久性？

我正在寻找在PhoneGap应用程序上的Angularjs数据持久性的最佳做法。 我在这个上面使用了Ionic Framework，但是与这个问题无关，因为它只是build立在Angular＆Cordova之上。 我喜欢Angular在数据持久性解决scheme上保持灵活性，因为它是一个非专门的混合应用程序框架的Web框架，所以这很有道理……想知道人们是如何解决这个问题的。 这里有一个概述： 要求 将本地数据库添加到预编译数据的应用程序版本。 这将超过5MB的数据限制。 启动时从本地数据库加载数据。 将更新的数据保存到本地数据存储库以进行持久化 如果可能的话，优先select无模式。 简单的查询界面。 我可以将所有的数据加载到内存中，只要使用标准的Angularfilter就可以了，只要性能很好。 对象查询接口…像一个类似于ActiveRecord的ORM，而不必在我的应用程序中编写SQL。 未来的certificate。 每次构build需要数据持久性的应用程序时，我都不想重新发明轮子。 也想select更标准的东西，如果可能的话，我可以继续使用它在未来…像Indexeddb的东西在这里是有道理的。 选项 我一直在看下面的选项。 你能提供任何这些反馈吗？ Breezejs – 看起来更专注于服务器。 有一个SQLite接口？ YDN-DB – 看起来像一个选项，但似乎有些晦涩的比较其他一些选项。 JayData – 这仍然是活跃的？ 关注它的商业方面。 Persistencejs – 这看起来很有希望。 该项目是否仍然活跃？ ngStorage – 这只是一个localStorage接口？ 它解决了5M限制吗？ Angular-cache – 我可以用这个预加载数据吗？ 我可以坚持多久数据？ localForage – 对此不太了解。 它解决了5M限制吗？ Pouchdb – 关注查询语言。 不解决5M的限制 Couchdb Lite – 关注查询语言。 […]

Backbone.js – 在哪里存储状态信息？

我是Backbone.js的新手，我试图找出状态variables应该存在的地方 。 我的用例： 我有一个应用程序，提供了一本书的阅读界面（我知道，经典的例子，对吧？）。 我的模型是Book和Page与集合类为每个。 应用程序的结构大致如下（原谅ASCII的Visio）： +————+ | Controller | +————+ | Views Models | +————–+ +—————-+ |-| IndexView |——| BookCollection | | +————–+ +—————-+ | | | +————–+ +—————-+ +-| BookView |——| Book | +————–+ +—————-+ | | | +————–+ | |-| TitleView |-+ | | +————–+ | +—————-+ | +-| Page | | […]

为什么对象不能在JavaScript中进行迭代？

为什么对象默认不能迭代？ 我总是看到与迭代对象有关的问题，常见的解决scheme是迭代对象的属性，并以这种方式访问​​对象内的值。 这似乎很常见，这使我想知道为什么对象本身不可迭代。 像ES6 for…of这样的语句默认使用对象。 因为这些特性只适用于不包含{}对象的特殊“可迭代对象”，所以我们必须经过这些循环才能使这个对象成为我们想要使用的对象。 for …语句创build一个循环遍历可迭代对象 （包括Array，Map，Set，arguments object等）… 例如使用ES6 生成器function ： var example = {a: {e: 'one', f: 'two'}, b: {g: 'three'}, c: {h: 'four', i: 'five'}}; function* entries(obj) { for (let key of Object.keys(obj)) { yield [key, obj[key]]; } } for (let [key, value] of entries(example)) { console.log(key); console.log(value); for (let [key, […]

用于表单的CSS网格系统（多列）

为了将来的参考，这里是像素完美精度的最终结果： stream体的CSSformshttp://i45.tinypic.com/2mn16xt.jpg CSS代码： ._25 { width: 21%; display: inline; float: left; margin-left: 2%; margin-right: 2%; } ._50 { width: 46%; display: inline; float: left; margin-left: 2%; margin-right: 2%; } ._75 { width: 71%; display: inline; float: left; margin-left: 2%; margin-right: 2%; } ._100 { width: 96%; display: inline; float: left; margin-left: 2%; margin-right: 2%; } […]