teratail
回答率
85.49%
質問するログイン新規登録
トップに関する質問Web画面の引数を画像ファイル名にして表示を行いたい。

編集履歴

質問編集履歴

4

全ソースコードと内容を記載しなおしました。

2018/04/26 08:22

投稿

IkemotoNoboru
IkemotoNoboru

スコア13

test CHANGED
File without changes
test CHANGED
@@ -2,31 +2,111 @@
2
2
 
3
3
 
4
4
 
5
- http://???.???.???.???/gazo_disp.html?q=12345.jpg
5
+ 画像フィアルが数千データが存在しており、他パッケージソフトより画像ファイル名
6
6
 
7
- にて、画像ファイル名を引き渡してファイル名にて複数の画像を表示
7
+ （格納パス＋ファイル名）を指定して画像を表示したいと思っております。
8
8
 
9
- させようよしております。
10
-
11
- 環境は、HTMLの身になっております。
12
-
13
- 初心者なので、エラーがでているかよくわかりませんが、下記内容では、画像が存在しません
14
-
15
- と表示されます。
16
-
17
- src= に、http://???.???.???.???/gazo_disp.html?q=12345.jpg で指定している。
18
-
19
- 12345.jpg を渡して、表示できるとよいのではないかと思っております。
9
+ HTMLとJacaScriptにて動作できることを目標にしております。
20
10
 
21
11
 
22
12
 
23
- <p id="param"> </p>
13
+ 呼び出しは下記方法を考えております。
24
14
 
15
+ http://???.???.???.???/gazo_disp.html?q=12345.jpg
16
+
25
- の表示は画像ファイル名を表示しております。
17
+ 12345.jpg ファイル名（実際には、パスを含みます。）
18
+
19
+ パスは、Webサーバのホームからのパスになります。
26
20
 
27
21
 
28
22
 
23
+ 確認のために下記コードにてファイル名が存在するか表示しております。
24
+
25
+ <p id="param"> </p>
26
+
27
+
28
+
29
+ <img での、画像ファイル名が入れば画像が表示されるのではないかと思います
30
+
31
+ が、うまくいっていないと思っております。
32
+
33
+ src="id="param""
34
+
35
+ お教えいただけるとありがたいです。
36
+
37
+
38
+
39
+ 全体のソースコードになります。
40
+
29
41
  ```HTML
42
+
43
+ <!DOCTYPE html>
44
+
45
+ <html lang="ja">
46
+
47
+ <head>
48
+
49
+ <meta charset="utf-8">
50
+
51
+ <title>画像</title>
52
+
53
+ <script type="text/javascript">
54
+
55
+ window.onload = function onLoad() {
56
+
57
+ param = GetQueryString();
58
+
59
+ target = document.getElementById("param");
60
+
61
+ target.innerHTML = param["q"];
62
+
63
+ }
64
+
65
+
66
+
67
+ function GetQueryString() {
68
+
69
+ if (1 < document.location.search.length) {
70
+
71
+ var query = document.location.search.substring(1);
72
+
73
+
74
+
75
+ var parameters = query.split('&');
76
+
77
+
78
+
79
+ var result = new Object();
80
+
81
+ for (var i = 0; i < parameters.length; i++) {
82
+
83
+ var element = parameters[i].split('=');
84
+
85
+
86
+
87
+ var paramName = decodeURIComponent(element[0]);
88
+
89
+ var paramValue = decodeURIComponent(element[1]);
90
+
91
+
92
+
93
+ // パラメータ名をキーとして連想配列に追加する
94
+
95
+ result[paramName] = decodeURIComponent(paramValue);
96
+
97
+ }
98
+
99
+ return result;
100
+
101
+ }
102
+
103
+ return null;
104
+
105
+ }
106
+
107
+ </script>
108
+
109
+ </head>
30
110
 
31
111
  <body>
32
112
 
@@ -40,6 +120,8 @@
40
120
 
41
121
  </body>
42
122
 
123
+ </html>
124
+
43
125
  ```
44
126
 
45
127
 

3

誠に申し訳ありませんでした。いかがでしょうか。

2018/04/26 08:22

投稿

IkemotoNoboru
IkemotoNoboru

スコア13

test CHANGED
File without changes
test CHANGED
@@ -26,6 +26,8 @@
26
26
 
27
27
 
28
28
 
29
+ ```HTML
30
+
29
31
  <body>
30
32
 
31
33
  <div>パラメーター</div>
@@ -38,6 +40,8 @@
38
40
 
39
41
  </body>
40
42
 
43
+ ```
44
+
41
45
 
42
46
 
43
47
  よろしくお願いいたします。

2

再度、改変いたしました。よろしくお願いいたします。

2018/04/26 06:30

投稿

IkemotoNoboru
IkemotoNoboru

スコア13

test CHANGED
File without changes
test CHANGED
@@ -8,15 +8,21 @@
8
8
 
9
9
  させようよしております。
10
10
 
11
+ 環境は、HTMLの身になっております。
12
+
13
+ 初心者なので、エラーがでているかよくわかりませんが、下記内容では、画像が存在しません
14
+
15
+ と表示されます。
16
+
17
+ src= に、http://???.???.???.???/gazo_disp.html?q=12345.jpg で指定している。
18
+
19
+ 12345.jpg を渡して、表示できるとよいのではないかと思っております。
20
+
11
21
 
12
22
 
13
23
  <p id="param"> </p>
14
24
 
15
25
  の表示は画像ファイル名を表示しております。
16
-
17
-
18
-
19
- <img の後の src= にどのように画像ファイル名をしてしたらよろしいでしょうか？
20
26
 
21
27
 
22
28
 
@@ -34,10 +40,4 @@
34
40
 
35
41
 
36
42
 
37
- できないことを質問しているのかもしれません。
38
-
39
- できないことであれば、ほかの方法があればお教えいただけるとありがたいです。
40
-
41
-
42
-
43
43
  よろしくお願いいたします。

1

全面的に記載方法を変えてみました。

2018/04/26 06:12

投稿

IkemotoNoboru
IkemotoNoboru

スコア13

test CHANGED
File without changes
test CHANGED
@@ -2,104 +2,42 @@
2
2
 
3
3
 
4
4
 
5
+ http://???.???.???.???/gazo_disp.html?q=12345.jpg
6
+
7
+ にて、画像ファイル名を引き渡してファイル名にて複数の画像を表示
8
+
5
- 現在、下記内容でやろうとしております。
9
+ させようよしております。
6
10
 
7
11
 
8
12
 
13
+ <p id="param"> </p>
14
+
9
- よろしくお願いいたします。
15
+ の表示は画像ファイル名を表示しております。
10
16
 
11
17
 
12
18
 
13
- <!DOCTYPE html>
14
-
15
- <html lang="ja">
16
-
17
- <head>
18
-
19
- <meta charset="utf-8">
19
+ <img の後の src= にどのように画像ファイル名をしてしたらよろしいでしょうか？
20
-
21
- <title>VPC 画像</title>
22
-
23
- <script type="text/javascript">
24
-
25
- window.onload = function onLoad() {
26
-
27
- param = GetQueryString();
28
-
29
- target = document.getElementById("param");
30
-
31
- target.innerHTML = param["q"];
32
20
 
33
21
 
34
-
35
- }
36
-
37
-
38
-
39
- function GetQueryString() {
40
-
41
- if (1 < document.location.search.length) {
42
-
43
- // 最初の1文字 (?記号) を除いた文字列を取得する
44
-
45
- var query = document.location.search.substring(1);
46
-
47
-
48
-
49
- // クエリの区切り記号 (&) で文字列を配列に分割する
50
-
51
- var parameters = query.split('&');
52
-
53
-
54
-
55
- var result = new Object();
56
-
57
- for (var i = 0; i < parameters.length; i++) {
58
-
59
- // パラメータ名とパラメータ値に分割する
60
-
61
- var element = parameters[i].split('=');
62
-
63
-
64
-
65
- var paramName = decodeURIComponent(element[0]);
66
-
67
- var paramValue = decodeURIComponent(element[1]);
68
-
69
-
70
-
71
- // パラメータ名をキーとして連想配列に追加する
72
-
73
- result[paramName] = decodeURIComponent(paramValue);
74
-
75
- }
76
-
77
- return result;
78
-
79
- }
80
-
81
- return null;
82
-
83
- }
84
-
85
- </script></head>
86
22
 
87
23
  <body>
88
24
 
89
25
  <div>パラメーター</div>
90
26
 
91
- <img id="para" src="160935_391.jpg" width="1280" height="960"
92
-
93
- alt="画像が存在しません。">
94
-
95
- <p>VPC 画像</p>
96
-
97
27
  <p id="param"> </p>
98
28
 
99
- <img src="160935_391.jpg" width="1280" height="960"
29
+ <img src="id="param"" width="1280" height="960"
100
30
 
101
31
  alt="画像が存在しません。">
102
32
 
103
33
  </body>
104
34
 
35
+
36
+
105
- </html>
37
+ できないことを質問しているのかもしれません。
38
+
39
+ できないことであれば、ほかの方法があればお教えいただけるとありがたいです。
40
+
41
+
42
+
43
+ よろしくお願いいたします。