仿猫眼电影购票html代码
时间: 2023-07-29 17:03:01 浏览: 223
以下是一个简单的仿猫眼电影购票的HTML代码示例:
```html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>猫眼电影购票</title>
<style>
/* CSS样式 */
</style>
</head>
<body>
<h1>猫眼电影购票</h1>
<div>
<h2>请选择电影</h2>
<select id="movie">
<option value="1">影片1</option>
<option value="2">影片2</option>
<option value="3">影片3</option>
</select>
</div>
<div>
<h2>请选择影院</h2>
<select id="cinema">
<option value="1">影院1</option>
<option value="2">影院2</option>
<option value="3">影院3</option>
</select>
</div>
<div>
<h2>请选择场次</h2>
<select id="session">
<option value="1">场次1</option>
<option value="2">场次2</option>
<option value="3">场次3</option>
</select>
</div>
<div>
<h2>请选择座位</h2>
<input type="checkbox" id="seat1" value="A1">
<label for="seat1">A1</label>
<input type="checkbox" id="seat2" value="A2">
<label for="seat2">A2</label>
<input type="checkbox" id="seat3" value="A3">
<label for="seat3">A3</label>
<!-- 其他座位 -->
</div>
<div>
<button onclick="bookTicket()">购票</button>
</div>
<script>
function bookTicket() {
// 获取选中的电影、影院、场次、座位信息
var movie = document.getElementById("movie").value;
var cinema = document.getElementById("cinema").value;
var session = document.getElementById("session").value;
var seats = [];
var checkboxes = document.querySelectorAll("input[type=checkbox]:checked");
for (var i = 0; i < checkboxes.length; i++) {
seats.push(checkboxes[i].value);
}
// 调用后端API,提交购票信息等操作
// 提示用户购票成功或失败等相关信息
alert("购票成功!");
}
</script>
</body>
</html>
```
注意:以上代码只是一个简化的示例,实际的开发中还需要与后端API进行交互,实现购票功能、获取电影、影院、场次等信息,并对提交的信息进行校验和处理。此外,还可以通过CSS样式使界面更加美观。
阅读全文