在javascript中连接字符串会导致缺少句点

Question

我正在尝试动态输出图像，但我在一个奇怪的问题上磕磕绊绊，其中javascript删除了一段时间（英国英语完全停止）。这意味着输出文件位置不正确，我收到错误404。

说：

var $zDiv = $('.childclass'),
    $prNx = $('.prev, .next'),
    $btns = $('.zanc > a'),
    n = $zDiv.length,
    c = 0; // current
    d = 4; //number of items

function toggView(){ 
  // content:
  $zDiv.hide();
  for(i=0;i<d && i+c<n;i++){
    $zDiv.eq(i+c).show(); 
  }
  // buttons:
  $prNx.show();
  if(c<=0){
    $('.prev').hide(); 
  }
  if(c+3>=n-1){
    $('.next').hide(); 
  } 
}
toggView();

$prNx.click(function(){ 
  c = $(this).hasClass('next') ? c += 4 : c -= 4;
  toggView();
});

$btns.click(function( e ){
   c = $(this).index();
   toggView();
});

你会碰巧知道原因吗？

var resultX = 10

输出src：

'<img style="margin-left:30px;" src="Images/Icons/' + parseInt(resultX * 10) + '.png" />\'

而不是

https//localhost/Images/Icons/100png

如果我将最后一位修改为https//localhost/Images/Icons/100.png

，则该脚本有效

修改

我按照建议删除了倒数第二个字符+ '..png" />\'。这个问题仍然存在。

Answer 1

我认为你在

中做了多余的“\”

'<img style="margin-left:30px;" src="Images/Icons/' + parseInt(resultX * 10) + '.png" />\'

当我删除它

(function(){
        var resultX = 10;
        var str = '<img style="margin-left:30px;" src="Images/Icons/' + parseInt(resultX * 10) + '.png" />';
        $('.row').append(str);
    })();

它会显示：

<img style="margin-left:30px;" src="Images/Icons/100.png">

Answer 2

删除最后的\，您的代码就足够了。这是我在chrome开发人员工具中尝试过的。

Answer 3

尝试使用模板文字。它对我有用。

var resultX = 10;
var output =`<img style="margin-left:30px;" src="Images/Icons/${resultX*10}.png"/>`
console.log(output)