无法在 img src 中设置 Js 变量

Question

我正在尝试将在 javascript 中创建的某些 html 内容设置为特定的 div。

我正在尝试下面的代码 -

var imgPath = data.destPath+data.fileName;
console.log(imgPath);    //  assets/users/Digvj_2_1480977246_tmp.png

var str = '<img src="{{asset('+imgPath+')}}" width="500" id="image_cropbox"><br><span style="font-style: italic; font-size: 13px"><small>Select The Required Area To Crop Image.</small></span>';
console.log(str);      // src= "http://localhost:8000/+imgPath+"

$('#user_profile_img').html(str);

在我尝试的第二个日志中，它直接打印变量名而不是值。

无法确定我在这里遗漏了什么。

Answer 1

Blade 在响应到达客户端之前生成视图，这时您的 javascript 正在执行。您正在尝试使用您在 javascript 中定义的变量作为 blade 变量。像这样更新它：

var imgPath = data.destPath+data.fileName;
console.log(imgPath);    //  assets/users/Digvj_2_1480977246_tmp.png

var str = '<img src="{{asset("")}}'+imgPath+'" width="500" id="image_cropbox"><br><span style="font-style: italic; font-size: 13px"><small>Select The Required Area To Crop Image.</small></span>';
console.log(str);      // src= "http://localhost:8000/+imgPath+"

$('#user_profile_img').html(str);

这将从 {{asset("")}} 生成 http://localhost:8000/ 然后当浏览器加载时它会将您的 js 变量附加到 url.

无法在 img src 中设置 Js 变量

Not able to set Js variable in img src

php

jquery

laravel

blade