質問編集履歴

4

コードを追加しました。

2022/01/19 06:49

投稿

siber
siber

スコア4

test CHANGED
File without changes
test CHANGED
@@ -1,7 +1,7 @@
1
1
  JavaScript初学者です。
2
2
 
3
3
  htmlページのボタンを押したときにイベントが発生するということをしたいです。
4
- ボタンを押した場合そのボタンの近くに写真(.jpg)が追加されるというものを作成したいです。
4
+ ボタンを押した場合そのボタンの近くに写真(.jpg)が追加されるというものを作成したいです。(本当はボタンではなくどこでもクリックすれば追加されるということがやりたいのですが、いくつか調べた感じではできなさそうだったのでボタンにしています。ボタンを使わず、マウスの場所にクリックで写真を追加する方法がある場合は教えていただきたいです。)
5
5
 
6
6
  ```html
7
7
  <html lang = "ja" >

3

質問文の追加

2022/01/19 06:46

投稿

siber
siber

スコア4

test CHANGED
File without changes
test CHANGED
@@ -1,6 +1,7 @@
1
1
  JavaScript初学者です。
2
2
 
3
3
  htmlページのボタンを押したときにイベントが発生するということをしたいです。
4
+ ボタンを押した場合そのボタンの近くに写真(.jpg)が追加されるというものを作成したいです。
4
5
 
5
6
  ```html
6
7
  <html lang = "ja" >
@@ -9,11 +10,25 @@
9
10
  <button id = "btn">bottun</button>
10
11
  </body>
11
12
  <script>
13
+ let Pic = function(){
14
+ this.image = new Image();
15
+ this.image.style.position = "fixed"
16
+ }
17
+ let Pic1 = function(){
18
+ Pic.apply(this,arguments);
19
+ this.x = 0;
20
+ this.y = 0;
21
+ this.image.src = "picture.jpg"
22
+ }
23
+
12
24
  window.onload = function(){
25
+ pic = new Pic1()
26
+ document.body.appendChild(pic.image)
13
27
  document.getElementById("btn").onclick = MouseClick;
14
28
  }
15
- function MouseClick(){
29
+ function MouseClick(e){
16
- やりたいイベント
30
+ pic.x = (e.clientX - pic.image.width /2)
31
+ pic.y = (e.clientY - pic.image.height/2)
17
32
  }
18
33
  </script>
19
34
  </html>

2

誤字訂正

2022/01/19 06:23

投稿

siber
siber

スコア4

test CHANGED
File without changes
test CHANGED
@@ -20,4 +20,6 @@
20
20
 
21
21
  ```
22
22
 
23
+ 以上がコードなのですがイベントの関数が作動せずボタンをクリックしても何も起こらないです。
24
+
23
- 以上がコードなのですが有識者の方に助言してもらえればうれしいです。
25
+ 有識者の方に助言してもらえればうれしいです。

1

2022/01/19 06:15

投稿

siber
siber

スコア4

test CHANGED
File without changes
test CHANGED
@@ -20,4 +20,4 @@
20
20
 
21
21
  ```
22
22
 
23
- 以上がコードなのですが有識者のに助言してもらえればうれしいです。
23
+ 以上がコードなのですが有識者のに助言してもらえればうれしいです。