我的代码需要帮助，我无法弄清楚如何从数组中循环值并将它们放入列表/菜单。我需要将数组循环使用roomType并将其与速率相结合，这样看起来会像这样（例如单人间（980.00））。对于每个选项，roomType和rate的值都是动态的。
请查看我的代码，如果我的方法正确，请告诉我。
谢谢。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
$(document).ready(function() {
$(function() {
$('#HasCart_TetrisHotel').ready(function() {
/* var hotel = HotelQuery('TetrisHotel');
$('#HasCart_TetrisHotel .hotName').append(hotel.name);
$('#HasCart_TetrisHotel .hotDesc').append(hotel.desc);
$('#HasCart_TetrisHotel .hotMenu').append('<select name="price">' +
$.each(hotel.roomType, function( intIndex, objValue ){
$(this).append(
$( "<option value='" + hotel.price + "' >" + hotel.roomType + "</option>" )
);
});
+ '</select>'); */
var hotel = HotelQuery('TetrisHotel');
$('#HasCart_TetrisHotel .hotName').append(hotel.name);
$('#HasCart_TetrisHotel .hotDesc').append(hotel.desc);
$('#HasCart_TetrisHotel .hotMenu').append('<select name="price">' + '</select>');
var hotel = HotelQuery('ParadiseInn');
$('#HasCart_ParadiseInn .hotName').append(hotel.name);
$('#HasCart_ParadiseInn .hotDesc').append(hotel.desc);
$('#HasCart_ParadiseInn .hotMenu').append('<select name="price">' + '</select>');
var hotel = HotelQuery('JamstoneInn');
$('#HasCart_JamstoneInn .hotName').append(hotel.name);
$('#HasCart_JamstoneInn .hotDesc').append(hotel.desc);
$('#HasCart_JamstoneInn .hotMenu').append('<select name="price">' + '</select>');
});
});
function HotelQuery(HotelName) {
switch (HotelName) {
case 'TimelessHotel':
var strHotelName = 'Timeless Hotel';
var strHotelDesc = 'Hotel Description Timeless Hotel';
var strHotelRate = ['980.00', '1,300.00', '1,600.00', '1,500.00', '1,800.00', '300.00', '150.00', '200.00'];
var strHotelRoomType = ['Single Room', 'Delux Room','Twin Room', 'Matrimonial Room', 'Presidential Suites', 'Extra Bed', 'Free Breakfast', 'Extra Person'];
; //end Timeless Hotel
case 'ParadiseInn':
var strHotelName = 'Paradise Inn';
var strHotelDesc = 'Hotel Description Paradise Inn';
var strHotelRate = ['980.00', '1,300.00', '1,600.00', '1,500.00', '1,800.00', '300.00', '150.00', '200.00'];
var strHotelRoomType = ['Single Room', 'Delux Room','Twin Room', 'Matrimonial Room', 'Presidential Suites', 'Extra Bed', 'Free Breakfast', 'Extra Person'];
break; //end Paradise Inn
case 'TetrisHotel':
var strHotelName = 'Tetris Hotel';
var strHotelDesc = 'Hotel Description Tetris Hotel';
var strHotelRate = ['980.00', '1,300.00', '1,600.00', '1,500.00', '1,800.00', '300.00', '150.00', '200.00'];
var strHotelRoomType = ['Single Room', 'Delux Room','Twin Room', 'Matrimonial Room', 'Presidential Suites', 'Extra Bed', 'Free Breakfast', 'Extra Person'];
break; //end Tetris Hotel
case 'JamstoneInn':
var strHotelName = 'Jamstone Inn';
var strHotelDesc = 'Hotel Description Jamstone Inn';
var strHotelRate = ['980.00', '1,300.00', '1,600.00', '1,500.00', '1,800.00', '300.00', '150.00', '200.00'];
var strHotelRoomType = ['Single Room', 'Delux Room','Twin Room', 'Matrimonial Room', 'Presidential Suites', 'Extra Bed', 'Free Breakfast', 'Extra Person'];
break; //end Jamstone Inn
}
return {
name: strHotelName,
desc: strHotelDesc,
rate: strHotelRate,
roomType: strHotelRoomType
};
};
});
</script>
<title>hotel query</title>
</head>
<body>
<div id="HasCart_TetrisHotel">
<table width="380px" border="1" cellspacing="3" cellpadding="0">
<tr>
<td class="hotName"></td>
<td class="hotDesc"> </td>
<td class="hotMenu"></td>
</tr>
</table>
</div>
<div id="HasCart_ParadiseInn">
<table width="380px" border="1" cellspacing="3" cellpadding="0">
<tr>
<td class="hotName"></td>
<td class="hotDesc"> </td>
<td class="hotMenu"></td>
</tr>
</table>
</div>
<div id="HasCart_JamstoneInn">
<table width="380px" border="1" cellspacing="3" cellpadding="0">
<tr>
<td class="hotName"></td>
<td class="hotDesc"> </td>
<td class="hotMenu"></td>
</tr>
</table>
</div>
<h2>Something Like This</h2>
<select name="price">
<option value="980.00">Single Room (980.00)</option>
<option value="1,300.00">Deluxe Room (1,300.00)</option>
<option value="1,600.00">Twin Room (1,600.00)</option>
<option value="1,500.00">Matrimonial Room (1,500.00)</option>
<option value="1,800.00">Presidential Suites (1,800.00)</option>
<option value="300.00">Extra Bed (300.00)</option>
<option value="150.00">Free Breakfast (150.00)</option>
<option value="200.00">Extra Person (200.00)</option>
</select>
</body>
</html>
答案 0 :(得分：0)
你走在正确的轨道上，最好在你的HotelQuery函数中构建选项。这里我们使用自终止while（优化'for'语句），并使用数组连接它比字符串连接更快，也许更清晰。如果您有任何疑问，请告诉我。一切顺利，M
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js">
</script>
<script type="text/javascript" charset="utf-8">
$(function(){
function buildPriceOptions(rate,type)
{
var i = rate.length, a = [];
while(i--) a.push(
[
'<option value="',rate[i],'">',type[i],
' (',rate[i],')','</option>'
]
.join('')
);
return a.reverse().join('\n')
}
function HotelQuery()
{
switch (true) {
case true :
var strHotelName = 'Jamstone Inn';
var strHotelDesc = 'Hotel Description Jamstone Inn';
var strHotelRate = [
'980.00', '1,300.00', '1,600.00',
'1,500.00', '1,800.00', '300.00',
'150.00', '200.00'];
var strHotelRoomType = [
'Single Room', 'Delux Room','Twin Room',
'Matrimonial Room', 'Presidential Suites', 'Extra Bed',
'Free Breakfast', 'Extra Person'];
var htmPrice = buildPriceOptions(
strHotelRate,
strHotelRoomType
);
break;
}
return {
name : strHotelName,
desc : strHotelDesc,
rate : strHotelRate,
roomType : strHotelRoomType,
prices : htmPrice
};
};
hotel = HotelQuery();
$('#HasCart_TetrisHotel .hotMenu').append(
[
'<select name="price">',
hotel.prices,
'</select>'
]
.join('')
);
})
</script>
</head>
<body>
<div id="HasCart_TetrisHotel">
<div class="hotMenu">
</div>
</div>
</body>
</html>