我正在使用html和js& amp;我使用的是java服务器页面。我已经编写了onload函数来为座位创建一些值
window.onload = function() {
...
createSeats(oseattable, numseatsperrow, rownums);
...
}
然后我调用createSeats函数来创建席位。
function createSeats(oSeatsContainer, seatsPerRow, rowNums){
var oRow = document.createElement('tr');
oRow.appendChild(document.createElement('th'));
oSeatsContainer.appendChild(oRow);
var seatClass = (document.getElementById('class')=="Economy")?1:11;
for (i = 0; i < rowNums; i++) {
var oRow = document.createElement('tr');
for (j = 0; j < seatsPerRow; j++) {
var oCell = document.createElement('td');
var oImg = document.createElement('img');
oImg.src = statusPics['avail'].src;
oImg.status = 'avail';
oImg.id = seatClass + j + (i*seatsPerRow);
for (c=0; c < dis.length; c++) {
var x = dis[c];
if (seatClass + j == x) {
oImg.src = statusPics['unavail'].src;
oImg.status = 'taken';
oImg.id = seatClass + j + (i*seatsPerRow);
}
}
oImg.onclick = function() {
if (this.status != 'taken') {
this.status = (this.status == 'avail') ? 'mine'
: 'avail';
this.src = (this.status == 'avail') ? statusPics['avail'].src
: statusPics['mine'].src;
}
}
oCell.appendChild(oImg);
oRow.appendChild(oCell);
}
oSeatsContainer.appendChild(oRow);
}
}
我得到了我想要的座位布局
然后我选择两个座位并点击确认选项,然后它会显示所选座位号和总价。 当我选择前两个座位时,我得到的座位号是正确的,
但是当我选择两个随机座位时,我会得到“未定义的”#39;作为元素id
这里是确认选择功能,
function confirmChoices() {
seatsSelected = new Array();
var strBookedSeats = '';
for (i = 0; i < oseats.length; i++) {
if (oseats[i].status == 'mine') {
seatsSelected.push(oseats[i].id);
oseats[i].src = statusPics['taken'].src
if(strBookedSeats=='')
strBookedSeats += seatsSelected[i];
else
strBookedSeats += ',' + seatsSelected[i];
}
}
var totalPrice = seatsSelected.length * seatPrice;
oBookedSeatNos.innerHTML = strBookedSeats;
oBooked.value = strBookedSeats;
oTotalprice.value = totalPrice;
oDispPrice.innerHTML = totalPrice;
oBtnBookSeats.disabled = (seatsSelected.length == seatstobebooked) ? false: true;
}
我做错了什么?如何纠正这个?
提前致谢!
答案 0 :(得分:2)
你试图循环遍历小阵列的座位选择[i];&#39;使用更大数量的&#39; oseats&#39; ,&#39;我&#39;。这导致在访问时不存在的条目。
尝试纠正数组使用情况,然后它应该可以正常工作。
我评论了您的代码以澄清
function confirmChoices() {
// array in which you add your 'seats selected seats'
seatsSelected = new Array();
var strBookedSeats = '';
for (i = 0; i < oseats.length; i++) {
//the oseats array might be quite large for example at the fourth seat you check 'i' will be 3.
if (oseats[i].status == 'mine') {
// just if the status is 'mine' the id of entry will be pushed to the array.
seatsSelected.push(oseats[i].id);
oseats[i].src = statusPics['taken'].src
//this works for the first seat as 'i' starts at 0.
// if you change the ID to be used from the oseats array this should work.
if (strBookedSeats == '')
//changed seatsSelected[i] with oseats[i].id
strBookedSeats += oseats[i].id;
else
//changed seatsSelected[i] with oseats[i].id
strBookedSeats += ',' + oseats[i].id;
}
}
var totalPrice = seatsSelected.length * seatPrice;
oBookedSeatNos.innerHTML = strBookedSeats;
oBooked.value = strBookedSeats;
oTotalprice.value = totalPrice;
oDispPrice.innerHTML = totalPrice;
oBtnBookSeats.disabled = (seatsSelected.length == seatstobebooked) ? false : true;
}
&#13;
答案 1 :(得分:0)
由于将值推入数组,您得到了错误的答案。删除 confirmChoices 功能中的数组。
function confirmChoices() {
var strBookedSeats = '';
var count = 0;
for (i = 0; i < oseats.length; i++) {
if (oseats[i].status == 'mine') {
count++;
console.log("After: "+oseats[i].id);
oseats[i].src = statusPics['taken'].src
if(strBookedSeats=='')
strBookedSeats += oseats[i].id;
else
strBookedSeats += ',' + oseats[i].id;
}
}
var totalPrice = count * seatPrice;
oBookedSeatNos.innerHTML = strBookedSeats;
oBooked.value = strBookedSeats;
oTotalprice.value = totalPrice;
oDispPrice.innerHTML = totalPrice;
oBtnBookSeats.disabled = (count == seatstobebooked) ? false: true;
}