小编pim*_*vdb的帖子

如何防止flex项目因文本而溢出?

我有一个列表的以下布局.每个列表项由两列表示.第二列应占用所有可用空间,但如果第一列占用太多空间,则应以最小大小固定在右侧.然后第一列应显示省略号.

问题出现在最后一个案例中.当第一列包含太多文本而不是显示省略号时,它会将自身伸展到弹性框之外,从而导致出现水平滚动条,而第二列不会固定在右侧.

我希望它像这样呈现(模型):

预期渲染

我怎样才能做到这一点?

这是 样本小提琴.

.container {
    display: -webkit-flex;
}

div {
    white-space: nowrap;
    text-overflow: ellipsis;
}

.container > div:last-child {
    -webkit-flex: 1;
    background: red;
}
Run Code Online (Sandbox Code Playgroud)
<!-- a small first column; the second column is taking up space as expected -->
<div class="container">
    <div>foo barfoo bar</div>
    <div>foo bar</div>
</div>

<!-- a large first column; the first column is overflowing out of the flexbox container -->
<div class="container">
    <div>foo barfoo barfoo barfoo barfoo barfoo barfoo bar
    foo barfoo barfoo …
Run Code Online (Sandbox Code Playgroud)

css google-chrome css3 flexbox

68
推荐指数
2
解决办法
7万
查看次数

如何计算大数模数?

如何在不使用计算器的情况下计算5 ^ 55模数221的模数?

我想密码学中的数论有一些简单的原理来计算这些东西.

math modulo

67
推荐指数
3
解决办法
14万
查看次数

node.log中的console.log和sys.puts之间的区别?

在node.js中,您可以使用console.logsys.puts打印到屏幕.

什么是首选方法,这些方法有什么区别?

javascript console node.js

54
推荐指数
3
解决办法
4万
查看次数

我应该使用原型吗?

我正在创建一个Vector类,它基本上可以包含三个数值.但是,可以在这样的矢量上完成很多操作 - 例如获取幅度,添加或减去另一个矢量等.

我想知道这些函数是否应该被编码为Vector类的原型函数,或者我应该在构造函数中定义它们.

那么这两种方法中哪一种更可取?

function Vector3D(x, y, z) {
    this.x = x;
    this.y = y
    this.z = z;
}

Vector3D.prototype.magnitude = function() {
    return Math.sqrt(this.x * this.x + this.y * this.y + this.z * this.z);
};
Run Code Online (Sandbox Code Playgroud)

要么

function Vector3D(x, y, z) {
    this.x = x;
    this.y = y;
    this.z = z;

    this.magnitude = function() {
        return Math.sqrt(this.x * this.x + this.y * this.y + this.z * this.z);
    };
}
Run Code Online (Sandbox Code Playgroud)

javascript

50
推荐指数
2
解决办法
9045
查看次数

如何从Canvas上的HTML5 File API中绘制图像?

我想在画布上绘制一个用HTML5 File API打开的图像.

在该handleFiles(e)方法中,我可以访问文件,e.target.files[0]但我无法直接使用该图像drawImage.如何从HTML5画布上的File API中绘制图像?

这是我用过的代码:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<script>
window.onload = function() {
    var input = document.getElementById('input');
    input.addEventListener('change', handleFiles);
}

function handleFiles(e) {
    var ctx = document.getElementById('canvas').getContext('2d');
    ctx.drawImage(e.target.files[0], 20,20);
    alert('the image is drawn');
}
</script>
</head>
<body>
<h1>Test</h1>
<input type="file" id="input"/>
<canvas width="400" height="300" id="canvas"/>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)

javascript drawimage fileapi html5-canvas

47
推荐指数
3
解决办法
7万
查看次数

Vanilla JavaScript版jQuery .click

所以也许我只是没有找到合适的地方,但我找不到如何做相当于jQuery的一个很好的解释

$('a').click(function(){
    // code here
});
Run Code Online (Sandbox Code Playgroud)

在简单的旧JavaScript?

基本上我想在每次a单击标签时运行一个函数,但是我没有能力将jQuery加载到页面中以上面的方式执行它所以我需要知道如何使用纯JavaScript来完成它.

javascript jquery function event-handling

47
推荐指数
6
解决办法
7万
查看次数

Array.prototype.slice.call(array,0)有什么用?

我只是浏览Sizzle的源代码,我遇到了这行代码:

array = Array.prototype.slice.call( array, 0 );
Run Code Online (Sandbox Code Playgroud)

我查看了函数是什么,但我得出的结论是,它只返回从索引0开始的数组的所有元素,并将整体放入数组中,即它根本不会做任何事情.

那么这行代码的用途是什么?我错过了什么?

编辑:这是来自https://github.com/jquery/sizzle/blob/master/sizzle.js#L863的第863行.

javascript arrays sizzle

46
推荐指数
3
解决办法
2万
查看次数

在JavaScript中"抛出新警告"?

目前我正在通过错误处理扩展我的JavaScript项目.该throw声明在这里发挥了重要作用:

throw new Error("text"); // Error: text
Run Code Online (Sandbox Code Playgroud)

但是,我还可以发出警告吗?我尝试了以下无济于事:

throw new Warning("text"); // Warning is not defined
Run Code Online (Sandbox Code Playgroud)

错误使Chrome的开发人员工具显示红叉,但如何让它显示警告图标(黄色感叹号)?

javascript error-handling throw

44
推荐指数
5
解决办法
3万
查看次数

在javascript中计算字符串值,而不是使用eval

有没有办法计算存储在JavaScript中的字符串中的公式而不使用eval

通常我会做类似的事情

var apa = "12/5*9+9.4*2";
alert(eval(apa));
Run Code Online (Sandbox Code Playgroud)

那么,有没有人知道替代品eval

javascript eval

41
推荐指数
6
解决办法
5万
查看次数

为什么在使用子选择器时table> tr> td不起作用?

我无法理解为什么以下选择器按预期工作(即获取td):

table tr td
Run Code Online (Sandbox Code Playgroud)

但这个没有:

table > tr > td
Run Code Online (Sandbox Code Playgroud)

td是后代tr,后者又是后代table,但他们也是彼此的孩子.因此,我认为>选择器也可以工作.

我做了两个小提琴:

  1. 孩子:http://jsfiddle.net/brLee/
  2. 后裔:http://jsfiddle.net/brLee/1/

为什么>选择器不在这里工作?

html css css-selectors

39
推荐指数
1
解决办法
2万
查看次数