質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

Q&A

1回答

847閲覧

jsの変数をimg srcに渡し新規Windowを開くには

Emizo1

総合スコア3

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

0グッド

0クリップ

投稿2021/05/24 09:13

編集2022/01/12 10:55

前提・実現したいこと

jsの変数をhrefではなく、img srcに渡し、新規のWinodowを開こうとしています。

発生している問題・エラーメッセージ

<div><a href="" id="btn-a" target="_blank">新規Windowが開きます</a></div> ならば、問題なく新規のwindowが開きますが、下記のようにimg srcを使うと新規Winodwは開きますが、thumbsで指定したURLに飛ばず、元のURLが開きます。対処方法を教えて頂けますか。 ### 該当のソースコード <a href="" id="btn-a" class="button-a" target="_blank"><img src="new_window.svg" class="thumb" data-image="" alt="新規Windowボタン"></a> const thumbs = document.querySelectorAll('.thumb'); thumbs.forEach(function (item, index) { item.onclick = function () { document.getElementById('bigimg').src = this.dataset.image; var target = document.getElementById("btn-a"); target.href = this.dataset.image; } }); ### 試したこと img srcで表示される画像を右クリックして”リンクを新しいwindowで開く”を選択すると、指定したURLが新規Windowで開きます。 ### 補足情報(FW/ツールのバージョンなど) ここにより詳細な情報を記載してください。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

yambejp

2021/05/24 09:17 編集

javaではない気がします bigimgというidのついたHTML要素はどこにあるのでしょうか?
Emizo1

2021/05/24 09:19

初心者です。すみませんが、全体としてはhtml、CSS、JSを使っていますが、抜粋したのはhtmlとJSの一部と思っていますが違うでしょうか。
yambejp

2021/05/24 09:24

> 違うでしょうか。 質問に質問で返されても、私には質問者さんと同じ環境があるわけではないので わかりかねます。 一応適当に回答つけてありますので、やりたいこととあったるかどうか 検証してみてください
kei344

2021/05/24 09:57

(質問文は編集できます)JavaとJavaScriptは違う言語なので、質問タグを編集してください。
kei344

2021/05/25 03:36

まだ質問が「受付中」になっていますが、「ベストアンサー」を選び「解決済」にされてはいかがでしょうか。
guest

回答1

0

javascript

1<a href="#" id="btn-a" class="button-a" target="_blank"><img src="new_window.svg" class="thumb" data-image="" alt="新規Windowボタン"></a> 2<script> 3const target = document.getElementById("btn-a"); 4document.querySelectorAll('.thumb').forEach(item=>{ 5 item.addEventListener('click',()=>{ 6 target.setAttribute("href",item.getAttribute("src")); 7 }); 8}); 9</script>

投稿2021/05/24 09:22

yambejp

総合スコア114572

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

Emizo1

2021/05/24 23:30

解決しました。また、どう質問すると欲しい回答が得られるかも少しわかったような気がします。ありがとうございました。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

まだベストアンサーが選ばれていません

会員登録して回答してみよう

アカウントをお持ちの方は

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問