Динамически добавить URL-адрес в строку с EasyButton

Question

Я пытаюсь добавить URL в строку с easybutton.js. Я использую leaflet.js, очевидно. В настоящее время он работает нормально, как это

var operator = L.easyButton('<img src="img/myimage.jpg">', function(btn, map){
    var destination = [window.my_lat, window.my_lng];
      map.flyTo(destination, 16, {
            animate: true,
            duration: 2 // in seconds
          });
}).addTo(map);

Но если я попробую это, оно не пройдет переменную? :

var myimg = "newimage";

var operator = L.easyButton('<img src="img/"+myimg+".jpg">', function(btn, map){
    var destination = [window.my_lat, window.my_lng];
      map.flyTo(destination, 16, {
            animate: true,
            duration: 2 // in seconds
          });
}).addTo(map);

Answer 1

Вы ошиблись с определением строки. В HTML вы можете использовать - "Двойные кавычки" - «Одиночные кавычки» - tilde

Вы должны изменить свой код ниже. var myimg = "newimage";

var operator = L.easyButton("<img src='img/"+myimg+".jpg'>", function(btn, map){
    var destination = [window.my_lat, window.my_lng];
      map.flyTo(destination, 16, {
            animate: true,
            duration: 2 // in seconds
          });
}).addTo(map);

Вы, конечно, можете попробовать:

//Using Single Quotes
'<img src="img/'+myimg+'.jpg">'
//Interpolation
`<img src="img/${myimg}.jpg'>`
//Ignoring HTML quotes altogether
"<img src=img/"+myimg+".jpg>"

Answer 2

Я думаю, что кавычки являются проблемой. Вместо

'<img src="img/"+myimg+".jpg">'

Должно быть

'<img src="img/' + myimg + '.jpg">'