我试图显示从本地机器选择的图像,我需要该图像的位置用于JavaScript函数。但我查不到地址。

为了获得图像位置,我尝试使用console.log,但没有返回任何结果。

console.log(document.getElementById("uploadPreview"));

下面是HTML代码:

<!DOCTYPE html>
<html>
<head>
  <title></title>
</head>

<body>
  <div align="center" style="padding-top: 50px">
    <img align="center" id="uploadPreview" style="width: 100px; height: 100px;" />
  </div>

  <div align="center" style="padding-left: 30px">
    <input id="uploadImage" type="file" name="myPhoto" onchange="PreviewImage();" />
  </div>

  <script type="text/javascript">
    function PreviewImage() {
      var oFReader = new FileReader();
      oFReader.readAsDataURL(document.getElementById("uploadImage").files[0]);

      oFReader.onload = function (oFREvent) {
        document.getElementById("uploadPreview").src = oFREvent.target.result;
        console.log(document.getElementById("uploadPreview").src);

      };
    }
  </script>

</body>
</html>

控制台输出:

以下是警告:

DevTools无法加载SourceMap:无法加载内容 chrome扩展:/ / alplpnakfeabeiebipdmaenpmbgknjce / include.preload.js.map: HTTP错误:状态代码404,net::ERR_UNKNOWN_URL_SCHEME


当前回答

你需要在开发者模式下打开Chrome:选择更多工具,然后选择扩展,然后选择开发者模式

其他回答

这是因为Chrome增加了对源地图的支持。

转到开发人员工具(浏览器中的F12),然后选择右上角的三个圆点,然后转到设置。

然后,查找Sources,并禁用这些选项:

“启用JavaScript源映射” “启用CSS源映射”

如果你这么做,警告就会消失。这与你的代码无关。检查其他页面中的开发人员工具,您将看到相同的警告。

在我的情况下,我犯了一个愚蠢的错误,添加bootstrap.min.js而不是bootstrap. bundle .js:)

我也有同样的问题。我试图一个接一个地禁用扩展来检查它,最后意识到我启用了Adblock,这导致了这个问题。为了消除这个错误,我执行下面的步骤,

三个点(右上角)。 单击更多工具—>扩展。 禁用广告拦截。 重新加载页面。

现在应该可以了。

我很欣赏这是你的扩展的一部分,但我看到这条消息在各种各样的地方这些天,我讨厌它:我如何修复它(这个修复似乎大大加快了浏览器)是通过添加一个死文件

物理上创建它想要的文件/在它想要的位置,作为一个空白文件(例如,"popper.min.js.map") 把这个放进空白文件里 { “版本”:1、 “映射”:“”, “来源”:[], “名称”:[], “文件”:“popper.min.js” } 确保空白文件内容中的“file”:“*******”与您的文件名******相匹配。Map(去掉。Map这个词)

(我怀疑你可以自己把这个死文件方法添加到插件中。)

在Edge浏览器的控制台中发现大量源映射错误后,我偶然发现了这个Stack Overflow问题。(我想我很久以前就禁用了Chrome浏览器中的警告。)

对我来说,这意味着首先意识到源地图是什么;请参考Macro Mazzon的回答来理解这一点。既然这是个好主意,那么问题就在于如何打开它们。

这就像在webpack.config.js文件中添加这一行一样简单

module.exports = {
    devtool: "source-map",
}

现在Edge可以检测到源映射,错误就消失了。

如果这个回答侮辱了任何人的智力,我很抱歉,但也许读到这篇文章的人会像我一样对源地图一无所知。