小编spi*_*ice的帖子

我正在使用无限滚动方法将内容加载到 div 中，但它无法正常工作。

这是我在window.onscroll函数中用于加载新内容的计算：

window.innerHeight + document.documentElement.scrollTop ===
document.documentElement.offsetHeight

但是document.documentElement.offsetHeight在添加新内容时永远不会收到更新的值。它始终保持在初始值，这导致整个无限滚动反向工作，仅在滚动到屏幕顶部时加载新内容，而不是按预期滚动到底部。

我已经确保附加的 div 被放在正确的元素中，也尝试使用document.getElementById('wrapper').offsetHeight而不是将它从身体上拉下来，但我得到了相同的结果。

我还尝试删除所有相关的 css 样式，以防万一导致问题，同样的结果。

我知道在没有更多信息的情况下，任何人都无法详细诊断此问题，但这是一个包含许多其他可能导致此问题的因素的大项目，所以我只是问是否有人遇到过某些问题类似的或有其他建议可以尝试吗？

非常感谢！

** 这是一个工作版本的沙箱（我从那里得到了最初的代码）。我只是不知道为什么我的代码库中的 offsetHeight 元素没有更新。

编辑在下面添加了我的 React 组件，但不确定它是否有助于诊断。

window.innerHeight + document.documentElement.scrollTop ===
document.documentElement.offsetHeight

编辑 2添加了控制台的屏幕截图以显示实际问题。

不确定我的措辞是否正确，但这是我想要做的。

我正在使用一个函数在页面上呈现多个wavesurfer实例。

开箱即用，这是直接的，因为您只需声明 wavesurfer 的每个单独实例：

var wavesurfer1 = WaveSurfer.create({
  container: domEl,
  barWidth: 3,
  .....

var wavesurfer2 = WaveSurfer.create({
  container: domEl,
  barWidth: 3,
  .....

但是我正在预加载 JSON 存储的波形数据，而不是在页面加载时加载任何音频文件，只有当用户单击播放按钮时才加载音频文件。此外，实例数量及其 ID 将动态创建。

我的逻辑正常工作，但是我无法定位 wavesurfer 的每个唯一实例，因为它们不是唯一的 - 因此我的问题是，我在官方网站（或 git）上找不到关于定位的任何信息个别情况。我认为这是可能的，container但无法找到有关如何执行此操作的任何信息，因此我正在尝试另一种方式。

在呈现 wavesurfer 的每个实例的函数中，我们有这个（domEl正在传递到函数中div并id为每个波形容器创建一个唯一的和）：

var wavesurfer = WaveSurfer.create({
  container: domEl,
  barWidth: 3,
  waveColor: '#CCC',
  progressColor: 'white',
  backend: 'MediaElement',
  mediaType:'audio',
  height: 80,
  cursorColor: 'white',
  responsive: true,
  hideScrollbar: true
});

以及加载实际音频的功能：

$('.m-btn-player').on('click', function() {

  id = $(this).data("id");
  var url …

我有两次Date()，当时间之间没有更多差异时，我尝试使用它们之间的差异来设置进度条的宽度从 100% 缩小到 0%，但我得到了非常奇怪的结果。

这就是我当前尝试执行的方法（它被拆分为 React 中的几个不同函数，因此我只包含相关的代码）：

首先，我设置了目标日期时间，将其设置endDate为接下来 24 小时内的整点时间（例如晚上 10 点整）...

this.endDate = new Date();

if (this.props.data.end_hr === 0) {
    this.endDate.setHours(24, 0, 0, 0);
} else {
    this.endDate.setHours(this.props.data.end_hr);
}
this.endDate.setMinutes(0);
this.endDate.setSeconds(0);

this.countdown = setInterval(this.timeRemaining, 1000);

然后在timeRemaining每秒触发的函数中，我获取当前日期时间并计算它们之间的差异。最后，我试图计算出发送到进度条 css width 属性的百分比...

let now = new Date().getTime();
let diff = this.endDate - now;

let percent =
  Math.round(((diff / this.endDate) * 100000000 * 2) / 100) + '%';

this.countdownProgress.style.width = percent;

100%正确diff，但百分比错误。

我尝试了各种不同的方法来计算我能想到的百分比，但没有任何效果符合预期，上面的方法是我能得到的最接近的方法。

有人可以告诉我哪里出错了吗？

编辑 …

只是npm对最新版本进行了较小的更新（我不记得它已经npm不再起作用了，因此是个问题），但是我认为更新之前的安装版本是5.6.0。不过那可能是错误的。

反正跑步后...

sudo npm install -g npm

... npm根本不再起作用。我所做的任何事情都会导致：

internal/modules/cjs/loader.js:596
    throw err;
    ^

Error: Cannot find module './auth.js'
    at Function.Module._resolveFilename (internal/modules/cjs/loader.js:594:15)
    at Function.Module._load (internal/modules/cjs/loader.js:520:25)
    at Module.require (internal/modules/cjs/loader.js:650:17)
    at require (internal/modules/cjs/helpers.js:20:18)
    at Object.<anonymous> (/usr/local/lib/node_modules/npm/node_modules/npm-registry-fetch/index.js:7:17)
    at Module._compile (internal/modules/cjs/loader.js:702:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:713:10)
    at Module.load (internal/modules/cjs/loader.js:612:32)
    at tryModuleLoad (internal/modules/cjs/loader.js:551:12)
    at Function.Module._load (internal/modules/cjs/loader.js:543:3)

有什么建议么？

我已经在本地计算机上用PHP构建了RESTful Api，并且一切运行正常。预检请求正在发送正确的响应等，PHP处理的所有工作都像梦一样。

但是，如果我尝试访问公共文件夹中的图像（在这种情况下通过javascript编程），我会很生气：

Access to XMLHttpRequest at 'http://localhost/tmp/avatars/user.jpg' from origin 'http://localhost:3000' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

我.htaccess在公共根目录，MAMP Apache <Directory>和<VirtualHost>指令中的文件中设置了以下内容，但它只是拒绝工作。

Header set Access-Control-Allow-Origin "*"
Header set Access-Control-Allow-Methods "*"

最好的情况下，CORS是最痛苦的事情，但这太荒谬了。为什么这不起作用？

有任何想法吗？

我得到一个 url，然后onClick在React使用这样的 regEx时使用处理程序剥离域：

const path = e.target.closest('a');
if (!path) return;
e.preventDefault();

console.log('path: ', path.href.replace(/^.*\/\/[^\/]+/, ''));

因此，如果 url 被说http://example.com/my-super-funky-page，它会console.log在之后的一切正确http://example.com- 例如：

/my-super-funky-page

但是我似乎对包含无用转义的 regEx 有问题。JS Lint 报告：

Unnecessary escape character: \/  no-useless-escape

我需要删除什么才能使这项工作按预期进行。我尝试了一些事情，结果却打破了。

我无法让 class_exists 查看我的类文件。

更烦人的是，如果我真的直接包含类文件，它会抱怨我不能包含它，因为类已经存在！说一记耳光。

这显然有很多部分，所以我将尝试包括相关的部分：

我正在检查的类是Router.php中函数中的 Posts.php

目录结构：

app
|
--->Project
   |
   |--->Controllers
   |   |
   |   --->Posts.php
   |
   |--->Core
   |   |
   |   --->Router.php

类名（控制器）是从查询字符串的一部分中提取出来的，它已经过测试和工作。即 - mysite.com/posts/view 将导致类名作为“帖子”传递，就像它应该用于 psr4 一样。

路由器调度功能出问题的部分。

if (class_exists($controller)) {
    $controller_object = new $controller();

 } else {
      echo "Controller class $controller missing";
 }

我试过直接包含类，就像我说的那样，我收到关于包含同一个类两次的警告。

我也试过使用类常量：

 if (class_exists($controller::class)) {

但得到：

Fatal error: Dynamic class names are not allowed in compile-time

还尝试使用完整的命名空间 url：

if (class_exists('Project\\Controllers\\' . $controller))

但同样，找不到类。

这是 Posts.php

namespace Project\Controllers;

class Posts
{

    public function …

我确定我只是错误地格式化了这个,但是我的一个查询得到了一个PDO异常而且调试没有帮助.

如果我运行以下它可以正常工作:

$db = static::getDB();

$sql = 'SELECT * FROM djs WHERE day = :day 
                 AND start_hour = :hr AND shifts LIKE :shift';

$stmt = $db->prepare($sql);
$stmt->bindParam(':day', $arr['day'], PDO::PARAM_STR);
$stmt->bindParam(':hr', $arr['hr'], PDO::PARAM_INT);
$stmt->bindParam(':shift', $shift, PDO::PARAM_STR);
$stmt->execute();
return $stmt->fetch(PDO::FETCH_OBJ);

但是当我尝试在查询中添加多个比较运算符时,如下所示:

$sql = 'SELECT * FROM djs WHERE day = :day 
                 AND start_hour > :hr AND end_hour <= :hr 
                 AND shifts LIKE :shift';

它抛出以下异常,指向包含execute命令的行:

Uncaught exception: 'PDOException'
Message: 'SQLSTATE[HY093]: Invalid parameter number'

end_hour表是一个有效的列,我试图确定它star_hour是否大于:hr和end_hour小于或等于:hr.我一定是做错了.有什么指针吗？这是因为我 …

要获得7天工作周的数字表示,请执行以下操作:

echo date('N'); // 2 (Tuesday)

是否有内置功能可以获得明天的数字日？

我知道如何以编程方式完成它,但我想知道是否有这样做的功能？

我有2个元素,一个div和一个文本输入并排.两者的宽度都是未知的,我正在尝试获取文本输入以填充容器的剩余宽度.

.wrap {
  width: 100%;
  box-sizing: border-box;
  padding: 10px;
  background: #EFEFEF;
  margin-top: 30px;
}

#url {
  margin: 6px 2px 0 0;
  float: left;
}

#input_1 {
  box-sizing: border-box;
  overflow: hidden;
  padding: 3px;
  font-size: 12px;
}

<div class="wrap">
  <div id="url">http://example.com/images/</div>
  <input id="input_1" name="input_1" type="text" value="somefile.jpg" />
</div>

小提琴

有什么建议？

*编辑

这是一个工作小提琴,使用尼克的答案,以防任何人需要它.