我有一个网页,注入通过AJAX传递的HTML.我不知道,先验,内容的大小,但我需要根据其大小在页面上定位内容.这是一个不起作用的简单方法:
$el.outerWidth(true).这种方法的问题在于内容非常复杂并且包括图像.当outerWidth()被调用时,浏览器尚未完成重绘屏幕,以便返回的大小是不准确的.(有趣的是,在我的情况下,初始尺寸总是远远大于最终值,而不是我预期的0.)
我可以通过在步骤2和3之间设置一个计时器来减少这个问题,但无论我多长时间制作计时器,某些系统上肯定会有一些浏览器会超过它.如果我让计时器足够长以覆盖大多数情况,那将通过引入不必要的延迟来惩罚使用更快系统的用户.虽然下面提到的一些答案表明a setTimeout(fn, 0)已足够,但我发现情况并非如此.我在2012年的MacBook Air上测量的喷涂时间高达60毫秒,下面的一个答案表明500毫秒.
看起来Mozilla曾经有过一个可能解决了我的问题的onPaint事件 ......如果它仍然存在并且其他浏览器已经采用了它.(两种情况都不是这样.)并且变异观察者在报告元素变化时似乎没有说明绘画时间.
非常感谢解决方案或评论.如下所述,之前已经提出过这个问题,但大多数问题都至少有一年之久,我很想再试一次.
遗憾的是,相关问题没有提供可行的答案
更新:嗯,似乎根本没有针对这个问题的通用解决方案.在我的特定情况下,我发现一个属性在内容加载和布局完成后可以可靠地更改.JavaScript轮询此属性的更改.一点也不优雅,但这是我能找到的最佳选择.
有谁知道让 jQuery 触发由（不是 jQuery.trigger() ）本机 JavaScript 事件处理程序处理的自定义事件所需的魔力？
test = document.querySelectorAll('.test')[0];
test.addEventListener('click', function() {
console.log('click')
});
test.addEventListener('custom', function(ev) {
console.log('custom', ev.detail)
});
// Custom Native -> Native works as expected
test.dispatchEvent(new CustomEvent('custom', {detail: 'detail'})); // -> "custom" "detail"
// Standard jQuery -> Native works as expected
$(test).trigger('click'); // -> "click"
// Custom jQuery -> Native does not work
$(test).trigger('custom'); // -> No log?
$(test).trigger({type: 'custom'}); // -> No log?
编辑添加：
有关我的用例的更多详细信息。我正在开发一个依赖自定义事件但本身不使用 jQuery 的库。然而，我想让这个库对那些有 jQuery 的应用程序来说更方便。
我正在使用 mocha 和 jsdom 对 JavaScript 库进行单元测试。库中的模块之一根据文档是否准备好而具有不同的行为。为了测试该行为，我需要模拟一个尚未完全就绪的文档（即它的readyState属性是"loading"）。简单的解决方案
delete document.readyState
document.readyState = 'loading'
// perform tests ...
不起作用，因为 jsdom 将该readyState属性视为只读。即使在该代码之后readyState仍然存在"complete"
有没有人遇到过针对此限制的任何巧妙的解决方法？
我明显错过了这里显而易见的事情,但已经过了漫长的一天.
以下代码在浏览器中创建一个无限循环:
M = Backbone.Model.extend({
localStorage: new Backbone.LocalStorage("ModelName"),
initialize: function() {
this.on("change", this.save, this);
}
});
虽然以下代码工作正常:
M = Backbone.Model.extend({
localStorage: new Backbone.LocalStorage("ModelName"),
initialize: function() {
this.on("change", this.modelChanged, this);
},
modelChanged: function() {
this.save();
}
});
有什么不同？
(是的,我使用的是本地存储而不是集合,但模型是集合中不存在的单例.)
我试图绑定这两个按钮的值 - "是"和"否" - 当点击formData使用ng-model但没有运气时.有没有办法实现这一目的而不是使用ng-model？
<button class=""
ng-class="{'button--is-selected--turquoise': isSelected,
'' : isSelected===false}"
ng-click="isSelected = true"
ng-model="formData.yesPool">Yes
</button>
<button class=""
ng-class="{'button--is-selected--turquoise':
isSelected === false, 'notSelected' : isSelected }"
ng-click="isSelected = false"
ng-model="formData.noPool"">No
</button>
这是我的控制器:
angular
.module('testApp')
.controller('formController', ['$scope', '$http', function($scope, $http) {
$scope.formData = {};
$scope.processForm = function(){
};
}]);