采用2D的方式模拟电影院购票的系统。选择的座位一次的追加到代付款的模块当中，最后确认信息后进行购票。

.box{

width: 540px;

height: 760px;

}

.weizi{

float: left;

padding-top: 24px;

padding-bottom: 42px;

border-bottom: dashed;

}

.first span

{

display: inline-block;

width: 38px;

height: 38px;

font-size: 13px;

background-color: #B9DEA0;

text-align: center;

color: #fff;

cursor: pointer;

border-radius: 5px;

margin-top: 24px;

}

.fourth span

{

display: inline-block;

width: 38px;

height: 38px;

color: #fff;

font-size: 13px;

background-color: #B9DEA0;

text-align: center;

cursor: pointer;

border-radius: 5px;

margin-top: 24px;

}

.second span{

display: inline-block;

width: 38px;

height: 38px;

color: #fff;

font-size: 13px;

background-color: #B9DEA0;

text-align: center;

cursor: pointer;

border-radius: 5px;

margin-top: 24px;

}

.third span{

display: inline-block;

width: 38px;

height: 38px;

color: #fff;

font-size: 13px;

background-color: #B9DEA0;

text-align: center;

cursor: pointer;

border-radius: 5px;

margin-top: 24px;

}

.show{

font-size: x-large;

float: right;

background-color: #f0f0f0;

color: #666;

border-radius: 5px;

height: 320px;

width: 36px;

text-align: center;

line-height: 146px;

}

.booking-details {

float: left;

position: relative;

width: 200px;

height: 450px;

}

.booking-details h3 {

margin: 5px 5px 0 0;

font-size: 16px;

}

.booking-details p {

line-height: 26px;

font-size: 16px;

color: #999

}

.booking-details p span {

color: #666

}

var price=5;

$(document).ready(function(){

$("#singleprice").text(price);

$("span").toggle(function(){

$(this).css('backgroundColor','gray');

$('

'+this.innerText+'').appendTo("#zuowei");

var ccon=parseInt($("#counter").text());

$("#counter").text((ccon + 1).toString());

var tprice=parseInt($("#total").text());

$("#total").text((tprice+ price).toString());

},function(){

$(this).css('backgroundColor','#B9DEA0');

$("li:contains('"+$(this).text()+"')").remove();

var ccon=parseInt($("#counter").text());

$("#counter").text((ccon -1).toString());

var tprice=parseInt($("#total").text());

$("#total").text((tprice-price).toString());

});

});

结果展示