drsxzut183207938
2018-07-19 23:32
浏览 519
已采纳

JavaScript CheckBox addEventListener（）

Below i have simple form that have 4 checkbox act as seats, What i am trying to do is when a visitor choose lets say a seat checkbox with ID A2 and A4 i want those ID and there total value to be shown instantly after clicked inside a paragraph with which have a name called id="demo" and when a button Reserve Now has been clicked the total value should be assigned in variable called $TotalCost.

Thanks.

<!DOCTYPE html>
<html>
<body>
<h2>Please choose a seat to book</h2>
<form action="/action_page.php" method="post">
<input type="checkbox" name="vehicle" id="A1" value="$100">$100<br>
<input type="checkbox" name="vehicle" id="A2" value="$65"> $65<br>
<input type="checkbox" name="vehicle" id="A3" value="$55"> $55<br>
<input type="checkbox" name="vehicle" id="A4" value="$50"> $50<br>



<p id="demo">
Selected Seat(s)
<br>
<br>
Total: USD  <input type="submit" value="Reserve Now">
</form>

</p>

<script>
document.getElementById("A1").addEventListener("click", displayCheck);

function displayCheck() {
    document.getElementById("demo").innerHTML = ;
}

    </script>
    </body>
    </html>

图片转代码服务由CSDN问答提供 功能建议

下面我有一个简单的表格，有4个复选框作为座位，我想做的是当访客选择 让我们说一个带有ID A2和A4的座位复选框我想要那些ID，并且在点击一个名为id =“demo”的段落内并且单击一下按钮后立即显示总值时，总值 应该在名为$ TotalCost的变量中分配。

谢谢。 

 ＆lt;！DOCTYPE html＆gt; 
＆lt; html＆gt; 
＆lt; 正文＆gt; 
＆lt; h2＆gt;请选择要预订的座位＆lt; / h2＆gt; 
＆lt; form action =“/ action_page.php”method =“post”＆gt; 
＆lt; input type =“checkbox”name =“vehicle”  id =“A1”value =“$ 100”＆gt; $ 100＆lt; br＆gt; 
＆lt; input type =“checkbox”name =“vehicle”id =“A2”value =“$ 65”＆gt;  $ 65＆lt; br＆gt; 
＆lt; input type =“checkbox”name =“vehicle”id =“A3”value =“$ 55”＆gt;  $ 55＆lt; br＆gt; 
＆lt; input type =“checkbox”name =“vehicle”id =“A4”value =“$ 50”＆gt;  $ 50＆lt; br＆gt; 
 
 
 
＆lt; p id =“demo”＆gt; 
选择席位
＆lt; br＆gt; 
＆lt; br＆gt; 
总计：USD＆lt; input type =“submit”  value =“立即预订”＆gt; 
＆lt; / form＆gt; 
 
＆lt; / p＆gt; 
 
＆lt; script＆gt; 
document.getElementById（“A1”）。addEventListener（“click”，displayCheck）; 
  
 * displayCheck（）{
 document.getElementById（“demo”）。innerHTML =; 
} 
 
＆lt; / script＆gt; 
＆lt; / body＆gt; 
＆lt; / html＆gt;
  • 写回答
  • 好问题 提建议
  • 追加酬金
  • 关注问题
  • 邀请回答

2条回答 默认 最新

报告相同问题？

提交

相关推荐 更多相似问题