小编dit*_*tto的帖子

使用inline-block打破一个新行?

我想删除<br />'s并通过CSS执行断行.如果我display:block将宽度更改为宽度将变为100%,我需要宽度正好是文本的长度,就像现在一样.有什么建议?

<div class="fullscreen">
    <p class="text">
        <span class="medium">We</span> <br />
        <span class="large">build</span> <br />
        <span class="medium">the</span> <br />
        <span class="large">Internet</span>
    </p>
</div>

.text span {
   background:rgba(165, 220, 79, 0.8);
   display:inline-block;
   padding:7px 10px;
   color:white;
}
.fullscreen .large {  font-size:80px }
Run Code Online (Sandbox Code Playgroud)

Fidddle

css

65
推荐指数
5
解决办法
11万
查看次数

使用fetch()返回HTML

我正在尝试获取文件并返回它的HTML.然而,它并不像我想象的那么简单.

    fetch('/path/to/file')
    .then(function (response) {
      return response.body;
    })
    .then(function (body) {
      console.log(body);
    });
Run Code Online (Sandbox Code Playgroud)

这将返回一个名为的对象ReadableByteStream.如何使用它来获取HTML文件内容?

如果我将内容更改/path/to/file为JSON字符串,并将上面的内容更改为:

    fetch('/path/to/file')
    .then(function (response) {
      return response.json();
    })
    .then(function (json) {
      console.log(json);
    });
Run Code Online (Sandbox Code Playgroud)

...它正确返回JSON.我该如何获取HTML?

javascript fetch-api

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

jQuery匹配hasClass类的一部分

我有几个div与"project [0-9]"类:

<div class="project1"></div>
<div class="project2"></div>
<div class="project3"></div>
<div class="project4"></div>
Run Code Online (Sandbox Code Playgroud)

我想检查元素是否有"project [0-9]"类.我有,.hasClass("project")但我坚持匹配数字.

任何的想法?

javascript jquery class

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

jQuery:找到重复的ID并删除除第一个之外的所有ID

    $('[id]').each(function () {

        var ids = $('[id="' + this.id + '"]');

        // remove duplicate IDs
        if (ids.length > 1 && ids[0] == this) $('#' + this.id).remove();

    });
Run Code Online (Sandbox Code Playgroud)

以上将删除第一个重复ID,但我想删除最后一个.我试过$('#'+ this.id + ':last')但无济于事.

小提琴

在附加动作发生时,应保留带有值'sample'的输入.

javascript each jquery

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

CSS动画:数字增量效果

我希望在数字快速变化时获得动画效果,例如:http://jsbin.com/kevalutupe/1/

我想单独使用这个CSS(我知道如何在JS中编写代码),我不想使用JS,因为我觉得锤击DOM并不是最好的解决方案.这完全可以用CSS吗?

我并没有对正确递增的数字感到困惑,我只是在效果之后.

css animation css3 css-animations

11
推荐指数
1
解决办法
3万
查看次数

$ _POST没有从Javascript的Fetch()中检索数据

我正在使用javascript发布数据fetch().

    fetch('/string.php', {
      method: 'post',
      body: JSON.stringify({
        name: 'helloe world',
      })
    })
    .then(function(response) {
      if (response.status >= 200 && response.status < 300) {
        return response.text()
      }
      throw new Error(response.statusText)
    })
    .then(function(response) {
      console.log(response);
    })
Run Code Online (Sandbox Code Playgroud)

string.php文件包含:

print_r($_POST);
Run Code Online (Sandbox Code Playgroud)

现在我的问题是$_POST返回一个空数组.我可以通过附加文件来解决这个问题:

$_POST = json_decode(file_get_contents('php://input'), true);
Run Code Online (Sandbox Code Playgroud)

但这感觉非常苛刻,并不理想.这是从JS检索发布数据时PHP的预期行为fetch()吗?

反正我是否可以自动将内容放入$_POST

javascript php post

11
推荐指数
2
解决办法
3385
查看次数

如何使用 SQL 执行 Optional JOIN

我想从 返回所有行biometrics,如果 JOIN 存在,则获取额外的数据。但是,我当前的查询仅在用户 ID 匹配时返回行。

我该如何解决这个问题,以便它返回所有生物特征行,以及来自 JOIN 的额外数据(如果存在)?

SELECT b.id as id, g.date
FROM `biometrics` as b
INNER JOIN `users goals` as g ON biometricid = b.id and userid = $user->id
Run Code Online (Sandbox Code Playgroud)

mysql sql t-sql join

9
推荐指数
1
解决办法
7588
查看次数

多维数组,删除键和值与另一个数组匹配的数组

我想删除重复项,其中测量或altunit匹配另一个数组,但忽略它们是否为空.

Array
(
    [0] => Array
        (
            [id] => 2
            [altunit] => %
            [measurement] => 
        )

    [1] => Array
        (
            [id] => 3
            [altunit] => 
            [measurement] => 6
        )

    [2] => Array
        (
            [id] => 4
            [altunit] => %
            [measurement] => 
        )

    [3] => Array
        (
            [id] => 5
            [altunit] => 
            [measurement] => 6
        )

    [4] => Array
        (
            [id] => 6
            [altunit] => 
            [measurement] => 6
        )

)
Run Code Online (Sandbox Code Playgroud)

Array
(
    [0] => Array
        (
            [id] => 2
            [altunit] …
Run Code Online (Sandbox Code Playgroud)

php arrays multidimensional-array

6
推荐指数
1
解决办法
1666
查看次数

按数据属性对列表项进行排序,按字母顺序排序,然后按数字排序

我想从AZ排序这个列表,然后是 0-9.

<ol class="columns">
  <li data-char="y">y</li>
  <li data-char="1">1</li>
  <li data-char="a">a</li>
  <li data-char="e">e</li>
  <li data-char="c">c</li>
  <li data-char="w">w</li>
  <li data-char="0">0</li>
  <li data-char="9">9</li>
  <li data-char="g">g</li>
</ol>

$(".columns li").sort(sort_li).appendTo('.columns');

function sort_li(a, b){
  return ($(b).data('char')) < ($(a).data('char')) ? 1 : -1;
}
Run Code Online (Sandbox Code Playgroud)

看了类似的问题,这就是我想出的,但它只适用于数字或字母(不是两者).https://jsfiddle.net/qLta1ky6/

javascript jquery

5
推荐指数
1
解决办法
981
查看次数

重叠范围输入.在点击更改输入时具有最接近的值

我有两个重叠的范围输入,这创建了一个多范围输入效果.

我想要它,以便每当对其中任何一个进行单击时,将更改具有与新单击的值最接近的值的输入.不完全确定如何解决这个问题.

我怎么能这样做?

(function() {
  "use strict";

  var supportsMultiple = self.HTMLInputElement && "valueLow" in HTMLInputElement.prototype;

  var descriptor = Object.getOwnPropertyDescriptor(HTMLInputElement.prototype, "value");

  self.multirange = function(input) {
    if (supportsMultiple || input.classList.contains("multirange")) {
      return;
    }

    var values = input.getAttribute("value").split(",");
    var max = +input.max || 100;
    var ghost = input.cloneNode();

    input.classList.add("multirange", "original");
    ghost.classList.add("multirange", "ghost");

    input.value = values[0] || max / 2;
    ghost.value = values[1] || max / 2;

    input.parentNode.insertBefore(ghost, input.nextSibling);

    Object.defineProperty(input, "originalValue", descriptor.get ? descriptor : {
      // Dang you Safari >:(
      get: function() { …
Run Code Online (Sandbox Code Playgroud)

javascript input

5
推荐指数
1
解决办法
1487
查看次数