我正在使用JavaScript函数来讨论输入DOM元素的值。
这个简单的化学应用程序有两个输入DOM元素，可以容纳两个值。
如果document.getElementById（“Hydrogen”）。值为= 2 和 document.getElementById（“Oxygen”）。value is = 1， 那么 document.getElementById（“Molecule”）。innerHTML should =“WATER”。
请查看JavaScript。
为什么“Molecule（）”功能不起作用？
- 谢谢
<!doctype> <html>
<head>
<!-- JavaScript (Button Controls) -->
<script>
function deleteHydrogen() { document.getElementById("Hydrogen").value--;}
function addHydrogen() {document.getElementById("Hydrogen").value++ ;}
function deleteCarbon() { document.getElementById("Carbon").value--; }
function addCarbon() { document.getElementById("Carbon").value++;}
function deleteOxygen() {document.getElementById("Oxygen").value--; }
function addOxygen() { document.getElementById("Oxygen").value++;}
function Molecule() {
if ((document.getElementById("Hydrogen").value=="2") &&
(document.getElementById("Oxygen").value=="1"))
{document.getElementById("Molecule").innerHTML="WATER"; } }
</script>
</head>
<body onload="Molecule()">
<input type="text" id="Hydrogen" style="width:160px; height:90px; font-
size:50px; text-align:center;" value="0" />
<input type="text" id="Carbon" style="width:160px; height:90px; font-
size:50px; text-align:center;" value="0" />
<input type="text" id="Oxygen" style="width:160px; height:90px; font-
size:50px; text-align:center;" value="0" />
<img id="delete_H" src="delete_H.png" style="width:80px; height:80px;"
onmousedown="deleteHydrogen()"/>
<img id="add_H" src="add_H.png" style="width:80px; height:80px;"
onmousedown="addHydrogen()" />
<img id="delete_C" src="delete_C.png" style="width:80px; height:80px;"
onmousedown="deleteCarbon()"/>
<img id="add_C" src="add_C.png" style="width:80px;
height:80px;"onmousedown="addCarbon()"/>
<img id="delete_O" src="delete_O.png" style="width:80px; height:80px;"
onmousedown="deleteOxygen()"/>
<img id="add_O" src="add_O.png" style="width:80px; height:80px;"
onmousedown="addOxygen()"/>
<p id="Molecule" style="width:510px; height:80px; font-size:50px;
color:white; text-align:center; background:gray;"> molecule </p>
</body> </html>
答案 0 :(得分：1)
它不起作用，因为package futures
import scala.concurrent.{Future, ExecutionContext}
// http://www.edofic.com/posts/2014-03-07-practical-future-option.html
case class FutureO[+A](future: Future[Option[A]]) extends AnyVal {
def flatMap[B](f: A => FutureO[B])(implicit ec: ExecutionContext): FutureO[B] = {
FutureO {
future.flatMap { optA =>
optA.map { a =>
f(a).future
} getOrElse Future.successful(None)
}
}
}
def map[B](f: A => B)(implicit ec: ExecutionContext): FutureO[B] = {
FutureO(future.map(_ map f))
}
}
// ========== USAGE OF FutureO BELOW ============= \\
import scala.concurrent.ExecutionContext.Implicits.global
import scala.concurrent.Future
object TeamDB {
val basketballTeam = Team(id = 111, player_ids = Set(111, 222))
val baseballTeam = Team(id = 222, player_ids = Set(333))
def findById(teamId: Int): Future[Option[Team]] = Future.successful(
teamId match {
case 111 => Some(basketballTeam)
case 222 => Some(baseballTeam)
case _ => None
}
)
}
object PlayerDB {
val basketballPlayer1 = Player(id = 111, jerseyNumber = 23)
val basketballPlayer2 = Player(id = 222, jerseyNumber = 45)
val baseballPlayer = Player(id = 333, jerseyNumber = 5)
def findById(playerId: Int): Future[Option[Player]] = Future.successful(
playerId match {
case 111 => Some(basketballPlayer1)
case 222 => Some(basketballPlayer2)
case 333 => Some(baseballPlayer)
case _ => None
}
)
}
object UserDB {
// user1 is on BOTH the baseball and basketball team
val user1 = User(id = 111, name = "Michael Jordan", player_ids = Set(111, 333), team_ids = Set(111, 222))
// user2 is ONLY on the basketball team
val user2 = User(id = 222, name = "David Wright", player_ids = Set(222), team_ids = Set(111))
def findById(userId: Long): Future[Option[User]] = Future.successful(
userId match {
case 111 => Some(user1)
case 222 => Some(user2)
case _ => None
}
)
}
case class User(id: Int, name: String, player_ids: Set[Int], team_ids: Set[Int])
case class Player(id: Int, jerseyNumber: Int)
case class Team(id: Int, player_ids: Set[Int])
case class UserContext(user: User, teams: Set[Team], players: Set[Player])
object FutureOptionListTest extends App {
val result = for {
user <- FutureO(UserDB.findById(userId = 111))
} yield for {
players: Set[Option[Player]] <- Future.traverse(user.player_ids)(x => PlayerDB.findById(x))
teams: Set[Option[Team]] <- Future.traverse(user.team_ids)(x => TeamDB.findById(x))
} yield {
UserContext(user, teams.flatten, players.flatten)
}
result.future // returns Future[Option[Future[UserContext]]] but I just want Future[UserContext] or UserContext
}
方法只在页面加载时运行一次（当所有值都为空时）。
Molecule如果您希望页面响应用户输入，则需要将事件侦听器添加到计算中的onload="Molecule()"
字段中。尝试删除input事件监听器并将onload添加到您的onclick="Molecule()"和Hydrogen Oxygen元素。