imgタグのsrcに変数を入れたい

kintone カスタマイズ
1

1.実現したいことと現状

imgタグのsrcを変数で指定しようとしています。

srcに「文字列」を直接代入すると画像が表示されますが、

srcに「文字列を格納した変数」を代入するとsrcの中身が空になります。

 

2.コード

srcに文字列を代入(画像が表示される)

tmpA.innerHTML = "<img id = 'targetImage' > ";

//セル作成済み
//const row = myRecordSpace.insertRow(myRecordSpace.rows.length);
//const cell1 = row.insertCell(0);
cell1.appendChild(tmpA);

const target = document.getElementById("targetImage");
trget.src = "https://books.google.com/books/content?id=tzTQsgEACAAJ&printsec=frontcover&img=1&zoom=1&source=gbs_api";

srcに変数を代入（画像が表示されない）

tmpA.innerHTML = "<img id = 'targetImage' > ";

//セル作成済み
//const row = myRecordSpace.insertRow(myRecordSpace.rows.length);
//const cell1 = row.insertCell(0);
cell1.appendChild(tmpA);

const target = document.getElementById("targetImage");
const image = record.imageLink.value;
console.log(typeof image); //String
console.log(image); //http://books.google.com/books/content?id=_tkKzgEACAAJ&printsec=frontcover&img=1&zoom=1&source=gbs_api
target.src = image;
//実行後のHTML <img id="targetImage" src="">

 

3.問い合わせ内容

上記の原因とその実現方法についてご教示いただけますと幸いです。

よろしくお願いいたします。

2

LA様

確認いただきたいことがあるのですが，
画像が表示されない例で，

const image = record.imageLink.value;

を

const image = "http://books.google.com/books/content?id=_tkKzgEACAAJ&printsec=frontcover&img=1&zoom=1&source=gbs_api";

…とすると，画像表示されますか？

もし表示されるのであれば，「このコードが実行されるタイミング」でrecord.imageLink.valueが空なのでは，と思われます．
何かしらのkintoneイベント内で実行していると思いますが，フィールドかレコードデータを確認いただければと思います．

3

TO様

コメントいただきありがとうございます。

頂いた内容に修正したところ、画像が表示されました。

 

原因は、登録していたダミーデータの登録内容とループの回し方により、

srcに入るrecord.imageLink.valueが空だったことでした。

 

おかげさまで、先に進めることができそうです。

この度はご確認いただきありがとうございました。

4

このトピックはベストアンサーに選ばれた返信から 3 日が経過したので自動的にクローズされました。新たに返信することはできません。