是否存在语法错误,导致它目前无法正常工作?但是,如果评论.click(检查(座位[i]));并取消注释.click(deleteBooking); &安培; .toggle(appendBooking,deleteBooking);
提前致谢。 欢呼声。
$(document).ready(function() {
function Seat(seat_xcoord, seat_ycoord, row_name, row_label, column_name, column_label){
this.seat_xcoord = seat_xcoord;
this.seat_ycoord = seat_ycoord;
this.row_name = row_name;
this.row_label = row_label;
this.column_name = column_name;
this.column_label = column_label;
this.state = false;
this.getState = function(){
return this.state;
}
this.setFstate = function(){
this.state = true;
}
this.setTstate = function(){
this.state = false;
}
}
function check(Seat){
if(Seat.getState==false){
appendBooking();
Seat.setTstate();
}else{
deleteBooking();
Seat.setFstate();
}
}
var seats = new Array();
var i =0;
var price = 0;
$.get('seating_plan.xml', function(d){
$(d).find('seat').each(function(){
var $seat = $(this);
var seat_xcoord = $seat.attr("seat_xcoord");
var seat_ycoord = $seat.attr("seat_ycoord");
var row_name = $seat.attr("row_name");
var row_label = $seat.attr("row_label");
var column_name = $seat.attr("column_name");
var column_label = $seat.attr("column_label");
var leftValue = seat_xcoord*20;
var bottomValue = seat_ycoord*20;
seats[i]= new Seat(seat_xcoord, seat_ycoord, row_name, row_label, column_name, column_label);
var $ticketRowDiv = $('<div id="ticket'+i+'"></div>'); //One row of ticket details
var $ticketInfoDiv = $('<div class="ticket-item">'+row_name+column_name+'</div><div class="ticket-item">$15.50</div>');
function deleteBooking(){
$seatdiv.css("background-color","#42de18"); //change seat color back to green
$ticketRowDiv.hide(); //hide the ticket details
price = price-15.50;
$('#price h1').html('$'+price); //display total price
}
function appendBooking(){
$seatdiv.css("background-color","#f64848"); //change seat color to red
$('#details').append($ticketRowDiv); //add ticket details to sidebar
$ticketRowDiv.show();
price =price+15.50;
$('#price h1').html('$'+price);//display total price
check(seats[i]);
}
function seatHover(){
$(this).addClass("seat-hover");
}
function seatUnHover(){
$(this).removeClass("seat-hover");
}
var $dltDiv = $('<div id="dlt_seat'+i+'" class="ticket-item"><a href="#">delete</a></div>')
//.click(deleteBooking);
.click(check(seats[i]));
$ticketRowDiv.append($ticketInfoDiv); //append "seat No." and "sub Total" to a ticket details row
$ticketRowDiv.append($dltDiv); //append "delete" link to a ticket details row
var $seatdiv = $('<div id = "seat'+i+'" class="seat"></div>')
.css({left: leftValue + 'px', bottom: bottomValue + 'px'}) //define seat location in seating map
.hover(seatHover,seatUnHover)
.click(check(seats[i]));
//.toggle(appendBooking, deleteBooking);
$('#canvas').append($seatdiv); //add a seat to seating map
i++;
});
});
});
答案 0 :(得分:1)
您正在绑定函数check
的返回值,而不是函数,函数不返回任何内容。
绑定一个调用check
函数的匿名函数:
.click(function(){ check(seats[i]); });
但是,您需要在代码周围创建一个闭包来捕获i
的值而不是变量本身,因为变量在事件发生之前发生了变化:
var $dltDiv = (function(i) {
return $('<div id="dlt_seat'+i+'" class="ticket-item"><a href="#">delete</a></div>').click(function(){ check(seats[i]); });
})(i);