所以我的API期望当特定延迟被解决时它会得到2个参数.
fn().done(function(arg1, arg2) {
console.log(arg1, arg2);
}).fail(function(err) {
console.error(err);
});
Run Code Online (Sandbox Code Playgroud)
现在与fn上面的函数有关,它需要先等待其他一些延迟返回才能解析.
function other() {
// stubbed out to always resolve
return $.Deferred().resolve().promise();
}
function fn() {
return other().then(function() {
return [1, 2];
});
}
Run Code Online (Sandbox Code Playgroud)
但是,这是行不通的,因为arg1会来[1, 2]和arg2会undefined.我无法弄清楚如何从Deferred.then()第一个成功过滤器函数参数返回一些内容,以便生成的管道延迟解析多个参数.
我当然可以这样做:
function fn() {
var done = $.Deferred();
other().done(function(){
done.resolve(1, 2);
}).fail(function(){
done.reject.apply(done, arguments);
});
return done.promise();
}
Run Code Online (Sandbox Code Playgroud)
但这并不像使用那么优雅.then(),我现在需要每次都担心负面的失败案例API,即使我知道我只是通过管道被拒绝的状态.
是的,我也可以改变fn()api来解决数组,但我真的希望有一个优雅的解决方案.
我需要一种更好的方法来计算可滚动div的视口.
在正常情况下,我会使用以下属性:(scrollLeft,scrollTop,clientWidth,clientHeight)
使用这些数字我可以准确地确定可滚动DOM元素的视口的哪个部分当前可见,我使用此信息异步加载在水平或垂直滚动到内容时按需对用户可见的内容.当DIV的内容很大时,由于加载了太多的DOM元素,这将避免令人尴尬的浏览器崩溃错误.
我的组件已经工作了一段时间没有问题,我们正在引入RTL支持.现在一切都因浏览器不一致而被抛弃.
为了演示,我创建了一个简单的例子,它将在JSFiddle中输出可滚动元素的scrollLeft属性.
此简单可滚动元素上scrollLeft属性的行为在一个浏览器与下一个浏览器之间不一致.我尝试过的3个主要浏览器都表现不同.
我希望避免像if(ie){...}else if(ff){...}else if (chrome){...}这样的代码会很糟糕,并且从长远来看,如果浏览器改变行为,则无法维护.
有没有更好的方法来确切地确定DIV的哪个部分目前可见?
也许除了scrollLeft之外还有一些其他可靠的DOM属性?
也许有一个jQuery插件会为我做,请记住它是哪个浏览器版本?
也许我可以使用一种技术来确定它在运行时的哪种情况而不依赖于某些不可靠的浏览器检测(即userAgent)
小提琴示例(下面复制的代码)
HTML
<div id="box"><div id="content">scroll me</div></div>
<div id="output">Scroll Left: <span id="scrollLeft"></span></div>
Run Code Online (Sandbox Code Playgroud)
CSS
#box {
width: 100px; height: 100px;
overflow: auto;
direction: rtl;
}
#content { width: 300px; height: 300px; }
Run Code Online (Sandbox Code Playgroud)
JS
function updateScroll() {
$('#scrollLeft').text(box.scrollLeft());
}
var box = $('#box').scroll(updateScroll);
updateScroll();
Run Code Online (Sandbox Code Playgroud) 条件如下:
页面似乎向左滚动太远(参见屏幕截图),因此右侧(通常在LTR模式下左侧)朝向中间,而是显示负空间.
您可以触摸向右拖动以向左滚动以查看从屏幕外开始的一些内容,但我只能向内滚动,这会使一些内容远离左侧,这是不可能的.
以下是我正在处理的缺陷的屏幕截图:

这是一个简单的HTML,可以重现问题:
<!DOCTYPE html>
<html dir="rtl">
<head>
<meta name="viewport" content="minimum-scale=0.25, maximum-scale=4.0, user-scalable=yes" />
</head>
<body style="background-color:grey">
<script src="http://code.jquery.com/jquery.js"></script>
<script>
setTimeout(function(){
$('<div style="width:2000px;background-color:red">test</div>').appendTo('body');
},1000);
</script>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
您可以按照以下步骤重现问题:

按按钮进行模拟 - 然后您会注意到红色框的右边缘靠近页面中间.但是,情况应该不是这样.那个红色的盒子应该是唯一的内容,它的右边没有任何东西,所以它应该与右边缘对齐.
只有在页面加载后动态插入宽内容时才会出现此问题,因此如果页面以宽内容开始,则滚动行为似乎正常.因此代码中的setTimeout().
有任何建议/解决方法来解决这个问题吗?
编辑:您也可以直接尝试此链接来重现问题:http://www.codefactor.net/ipadissue.html
我的代码需要按需加载脚本.
function includeJS(uri) {
return jQuery.getScript(uri);
}
includeJS('/path/to/script.js').always(function() {
// do something after script is loaded
});
Run Code Online (Sandbox Code Playgroud)
但问题是,Chrome文件将无法在Chrome开发人员工具中使用,就像页面上静态包含的其他文件一样.由于这个我不能轻易放断点.
有没有jQuery.getScript的替代方案,它还会在Chrome开发者工具中显示能够提供断点的脚本?
编辑:根据当前接受的答案添加解决方案(我仍然会考虑其他解决方案,但这似乎对我有用)
function includeJS(uri) {
var def = $.Deferred();
var script = document.createElement('script');
script.src = uri;
script.onload = function() {
def.resolve();
}
script.onerror = function() {
def.reject();
}
document.body.appendChild(script);
return def.promise();
}
Run Code Online (Sandbox Code Playgroud) 我正在尝试构建一个"幻灯片放映"类型的应用程序.每个载玻片有一个固定的纵横比,但我想的内容,以与它们的正常宽度/高度被渲染 - 所以我试图使用CSS3"变换:规模"在幻灯片的内容,使用所述视口宽度/高度我计算理想的比例/边距以使幻灯片适合视口.在一张特定的幻灯片上,我正在为人们展示一些"信息卡",并列出每个人的"接班人"
Chrome在图片上显示出一些非常奇怪的行为.如果您调整窗口大小,图像会移动到整个地方.如果强制图像以某种方式重新绘制图像似乎自我修复(即向下滚动页面并向后滚动)
编辑这似乎与具有边框半径的框内的图像有关!
这是Chrome中的错误吗?有没有解决这个问题的工作?
在此实例中 - 您可以调整结果窗格的大小以使图像缩放.至少在我的chrome版本中,图像变得混乱.
我把代码调低到了重现问题所需的最低限度.我只使用了webkit供应商前缀.
我还更新了问题描述,因为在摆弄代码之后我意识到它必须与包含图像的元素的边界半径有关!
<div class="container">
<div class="inner">
<div class="box">
<img src="https://en.gravatar.com/userimage/22632911/5cc74047e143f8c15493eff910fc3a51.jpeg"/>
</div>
</div>
</div>
Run Code Online (Sandbox Code Playgroud)
body {
background-color: black;
}
.inner {
background-color: white;
width: 800px;
height: 600px;
-webkit-transform-origin: 0 0;
}
.box {
overflow: hidden;
-webkit-border-radius: 10px;
width: 80px;
height: 80px;
margin: 10px;
}
Run Code Online (Sandbox Code Playgroud)
(function ($) {
var $inner = $('.inner');
var $window = $(window);
var iWidth = parseInt($inner.css('width'));
var iHeight = …Run Code Online (Sandbox Code Playgroud) 在我的应用程序中,我希望有一个实时聊天功能 - 其中多个人(可能是5个或更多)可以同时聊天.
我正在使用基于Java的Google App Engine - 这是我第一次尝试使用GAE数据存储区,我已经习惯使用Oracle/MySQL,所以我认为我的策略是错误的.
注意:为简单起见,我省略了任何验证/安全检查.
在一些名为WriteMessageI的servlet中,我有以下代码
Entity entity = new Entity("ChatMessage");
entity.setProperty("userName", request.getParameter("userName"));
entity.setProperty("message", request.getParameter("message"));
entity.setProperty("time", new Date());
DatastoreService datastore = DatastoreServiceFactory.getDatastoreService();
datastore.put(entity);
Run Code Online (Sandbox Code Playgroud)
在其他一些叫做ReadMessages我的servlet中有以下代码
String id = request.getParameter("id");
DatastoreService datastore = DatastoreServiceFactory.getDatastoreService();
Query query = new Query("ChatMessage");
if (id != null) {
// Client requested only messages with id greater than this id
Filter idFilter = new FilterPredicate(Entity.KEY_RESERVED_PROPERTY,
FilterOperator.GREATER_THAN,
KeyFactory.createKey("ChatMessage", Long.parseLong(id)));
query.setFilter(idFilter);
}
PreparedQuery pq = datastore.prepare(query);
JsonArray messages = new JsonArray(); …Run Code Online (Sandbox Code Playgroud) 我的公司要求新代码的测试覆盖率达到 90%,对于 Java 代码,我使用 gradle jacoco 插件,这很好;然而,当分支数量开始呈指数增长(夸张一点,可能是几何增长)时,分支覆盖率很难提高到90%。
这是一个非常人为的例子:
public class Application {
public static void test(boolean a, boolean b) {
if (a && b) {
System.out.println("true!");
} else {
System.out.println("false!");
}
}
}
Run Code Online (Sandbox Code Playgroud)
和测试:
public class ApplicationTests {
@Test
public void test() {
Application.test(true, true);
Application.test(false, false);
}
}
Run Code Online (Sandbox Code Playgroud)
覆盖率报告如下所示:
它还说我错过了 4 个分支中的 1 个,或者换句话说,我已经覆盖了 4 个分支中的 3 个(分支覆盖率为 75%)。
如果我在这里增加布尔值的数量,看起来分支的数量是 n*2,其中 n 是布尔值的数量。因此 3 (a,b,c) 变为 6 个分支,10 变为 20 个分支。所以我想我不明白在这种情况下有 6 个或 20 个分支意味着什么。
为了满足这个问题 - 我可以
A) …
我的公司大量使用常春藤来下载依赖项.其中一些依赖项很大(约500MB),需要一段时间才能从远程存储库下载.
为了构建我们的应用程序,我们有一个ant脚本,它将首先解析所有依赖项并将其部署到服务器.
我已经设置了一个"IVY_HOME"环境变量,以便所有依赖项都下载到D:\ ivy_home而不是C:\ Users\.ivy2\ - 这是因为D:是我的SSD,它明显更快,而且它是我的地方本地服务器目录位于 - 因此将文件从ivy_home复制到服务器是非常快的.
但出于某种原因,当我在eclipse中使用IvyDE插件时 - 它总是希望下载所有依赖项的单独副本并将它们放入我的C:\中,这会导致几个问题:
我想在jQuery移动列表视图的左侧添加2个投票按钮.投票按钮应位于列表项的中心,并且应位于左侧.
我有点使用javascript工作,但我真正想做的是让它在没有任何额外的javascript的情况下工作,并使用标准的jquery移动数据角色属性和纯HTML和CSS的增强.
这是我想要使用的HTML标记:
<div data-role="page">
<div data-role="content">
<ul class="has-vote-btns" data-role="listview">
<li>
<a href="#">
<h3>Line Item</h3>
<p>Sub title</p>
</a>
<a href="#" data-icon="bars"></a>
<a href="#" class="vote-btn like-btn" data-icon="arrow-u" title="Like"></a>
<a href="#" class="vote-btn dislike-btn" data-icon="arrow-d" title="Dislike"></a>
</li>
</ul>
</div>
</div>
Run Code Online (Sandbox Code Playgroud)
这是CSS:
.vote-btn {
position: absolute;
top: 50%;
left: 5px;
z-index: 2;
}
.vote-btn .ui-btn-inner {
padding: 0;
}
.like-btn {
margin-top: -30px;
}
.dislike-btn {
margin-top: 0px;
}
.has-vote-btns .ui-link-inherit {
padding-left: 40px !important;
}
.has-vote-btns .ui-li-has-thumb .ui-link-inherit {
padding-left: 118px !important;
} …Run Code Online (Sandbox Code Playgroud)