前提・実現したいこと
ここに質問の内容を詳しく書いてください。
html,javascriptで画像サイズ変更システムを作っています。
初期動作としてセレクトボックスで選択した値に連動して画像と、その画像の縦横のサイズを表示したいと思っています。
idの引用がうまくいってないのかなと思ったのですが、わからなくて質問しました。
また、naturalheight,naturalwidthの使い方はこれで合っているのでしょうか?
発生している問題・エラーメッセージ
エラーメッセージ
html 該当のソースコード
<!DOCTYPE html> <html lang="ja" xmlns="http://www.w3.org/1999/xhtml"> <head> <meta charset="utf-8" /> <title>ホーム</title> </head> <body> <form name="form1"> <!-- セレクトボックスで表示するものを指定 --> <select name="ProductSelect"> <option value="Tシャツ">Tシャツ</option> <option value="パンツ">パンツ</option> </select> </form> <!-- 送信ボタン --> <input type="button" value="送信" onclick="clickBtn1()"/></body> </html><script type="text/javascript"> // "送信"ボタンが押された時の動作を設定 function clickBtn1() { const ProductSelect = document.form1.ProductSelect; //値(数値)を取得 const num = ProductSelect.selectedIndex; //const num = document.form1.ProductSelect.selectIndex; //値(数値)から値(value値)を取得 const str = Productselect.options[num].value; //const str = document.form1.ProductSelect.options[num].value; //選ばれたvalue値から画像が選択され、その画像と大きさを表示 if (str == Tシャツ) { document.write = ('<img src="tshirt-mm-p.img" id="target1">') var OrgHeight = document.getElementById('target1').naturalHeight; var OrgWidth = document.getElementById('target1').naturalWidth; document.write("縦" + OrgHeight + "mm<br/>") document.write("横" + OrgWidth + "mm<br/>") } else if (str == パンツ) { document.write = ('<img src="pants-mm-p.img" id="target2">') var OrgHeight = document.getElementById('target2').naturalHeight; var OrgWidth = document.getElementById('target2').naturalWidth; document.write("縦" + OrgHeight + "mm<br/>") document.write("横" + OrgWidth + "mm<br/>") } } </script>
試したこと
画像表示のdocument.writeの位置をずらしたりしてみましたが、うまくいきませんでした
補足情報(FW/ツールのバージョンなど)
visual studio2019を使っています。
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2020/01/24 08:52