質問編集履歴
1
試したことを追記
test
CHANGED
|
File without changes
|
test
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
|
|
1
|
+
### 前提・解決したいこと
|
|
2
2
|
|
|
3
3
|
テキストボックス内に特定の数値を入力すると
|
|
4
4
|
|
|
@@ -8,7 +8,7 @@
|
|
|
8
8
|
|
|
9
9
|
|
|
10
10
|
|
|
11
|
-
|
|
11
|
+
### 発生している問題
|
|
12
12
|
|
|
13
13
|
数値によって色の変更はできているが、
|
|
14
14
|
|
|
@@ -81,3 +81,73 @@
|
|
|
81
81
|
</body>
|
|
82
82
|
|
|
83
83
|
```
|
|
84
|
+
|
|
85
|
+
### 試したこと
|
|
86
|
+
|
|
87
|
+
|
|
88
|
+
|
|
89
|
+
```html
|
|
90
|
+
|
|
91
|
+
コード
|
|
92
|
+
|
|
93
|
+
<head>
|
|
94
|
+
|
|
95
|
+
<meta charset="UTF-8">
|
|
96
|
+
|
|
97
|
+
<title>if文</title>
|
|
98
|
+
|
|
99
|
+
<link rel="stylesheet" type="text/css" href="base.css">
|
|
100
|
+
|
|
101
|
+
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
|
|
102
|
+
|
|
103
|
+
<script>
|
|
104
|
+
|
|
105
|
+
//変更箇所
|
|
106
|
+
|
|
107
|
+
$(function () {
|
|
108
|
+
|
|
109
|
+
$("#button").on("click", function () {
|
|
110
|
+
|
|
111
|
+
var text = $("#value").val();
|
|
112
|
+
|
|
113
|
+
$("#box").css("background-color", text == "1" ? "red" : (text == "2" ? "yellow" : "blue"));
|
|
114
|
+
|
|
115
|
+
});
|
|
116
|
+
|
|
117
|
+
});
|
|
118
|
+
|
|
119
|
+
</script>
|
|
120
|
+
|
|
121
|
+
</head>
|
|
122
|
+
|
|
123
|
+
|
|
124
|
+
|
|
125
|
+
<body>
|
|
126
|
+
|
|
127
|
+
<input type="text" id="value">
|
|
128
|
+
|
|
129
|
+
<input type="button" id="button" value="ボタン">
|
|
130
|
+
|
|
131
|
+
<div id="box">
|
|
132
|
+
|
|
133
|
+
</div><!-- button -->
|
|
134
|
+
|
|
135
|
+
</body>
|
|
136
|
+
|
|
137
|
+
```
|
|
138
|
+
|
|
139
|
+
他のQ&Aを検索してみて同じようなものがあったので使用してみた。
|
|
140
|
+
|
|
141
|
+
この場合だとboxの色が変更される。
|
|
142
|
+
|
|
143
|
+
しかしどのような動作で動いているのか不明なため参考にできない。
|
|
144
|
+
|
|
145
|
+
(そのQ&Aにも解説なし)
|
|
146
|
+
|
|
147
|
+
|
|
148
|
+
|
|
149
|
+
### 補足情報（FW/ツールのバージョンなど）
|
|
150
|
+
|
|
151
|
+
|
|
152
|
+
|
|
153
|
+
ここにより詳細な情報を記載してください。
|