在Jquery和List中切换语句

时间:2009-09-16 19:30:24

标签: javascript jquery switch-statement conditional-statements

我想知道我的方法是否有效和正确。我的代码不起作用,我不知道为什么。

<!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 HotelQuery(HotelName) {
   switch (HotelName) {
    case 'TimelessHotel': 
     var strHotelName = 'Timeless Hotel';
     var strHotelDesc = 'Hotel Description Timeless Hotel';
     var strHotelPrice = ['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 strHotelPrice = ['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 Paradise Inn

    case 'TetrisHotel': 
     var strHotelName = 'Tetris Hotel';
     var strHotelDesc = 'Hotel Description Tetris Hotel';
     var strHotelPrice = ['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 Tetris Hotel 

    case 'JamstoneInn': 
     var strHotelName = 'Jamstone Inn';
     var strHotelDesc = 'Hotel Description Jamstone Inn';
     var strHotelPrice = ['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 Jamstone Inn 

   }
  };


 });

   </script>     

<title>hotel query</title>
</head>

<body>

  <a href="#" onclick="javascript: HotelQuery('TetrisHotel'); alert: (strHotelName, strHotelDesc, strHotelPrice);">Tetris Hotel Query</a>

</body>
</html>

4 个答案:

答案 0 :(得分:27)

您的代码不起作用,因为变量的范围限定为函数HotelQuery。我认为您可能想要做的是返回一个具有该函数属性的对象,并使用不显眼的JavaScript方法将click事件处理程序绑定到<a>元素。

这样的东西
$(function() {
    $('a').click(function() {
        var hotel = HotelQuery('TetrisHotel');

        alert(hotel.name) // alerts 'Tetris Hotel'
    });
});

function HotelQuery(HotelName) {
    var strHotelName;
    var strHotelDesc;
    var strHotelPrice;
    var strHotelRoomType;

    switch (HotelName) { 
        case 'TimelessHotel': 
            strHotelName = 'Timeless Hotel';
            strHotelDesc = 'Hotel Description Timeless Hotel';
            strHotelPrice = ['980.00', '1,300.00', '1,600.00', '1,500.00', '1,800.00', '300.00', '150.00', '200.00'];
            strHotelRoomType = ['Single Room', 'Delux Room','Twin Room', 'Matrimonial Room', 'Presidential Suites', 'Extra Bed', 'Free Breakfast', 'Extra Person']; 
            break; //end Timeless Hotel  

        case 'ParadiseInn': 
            strHotelName = 'Paradise Inn';
            strHotelDesc = 'Hotel Description Paradise Inn';
            strHotelPrice = ['980.00', '1,300.00', '1,600.00', '1,500.00', '1,800.00', '300.00', '150.00', '200.00'];
            strHotelRoomType = ['Single Room', 'Delux Room','Twin Room', 'Matrimonial Room', 'Presidential Suites', 'Extra Bed', 'Free Breakfast', 'Extra Person'];    
            break; //end Paradise Inn

        case 'TetrisHotel': 
            strHotelName = 'Tetris Hotel';
            strHotelDesc = 'Hotel Description Tetris Hotel';
            strHotelPrice = ['980.00', '1,300.00', '1,600.00', '1,500.00', '1,800.00', '300.00', '150.00', '200.00'];
            strHotelRoomType = ['Single Room', 'Delux Room','Twin Room', 'Matrimonial Room', 'Presidential Suites', 'Extra Bed', 'Free Breakfast', 'Extra Person'];  
            break; //end Tetris Hotel 

        case 'JamstoneInn': 
            strHotelName = 'Jamstone Inn';
            strHotelDesc = 'Hotel Description Jamstone Inn';
            strHotelPrice = ['980.00', '1,300.00', '1,600.00', '1,500.00', '1,800.00', '300.00', '150.00', '200.00'];
            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,
        price: strHotelPrice,
        roomType: strHotelRoomType 
    }
};

注意到每次时你也会返回除酒店名称和描述之外的相同值(你可能只是作为一个例子,我不确定)。您可以将所有变量的值分配给声明(或将值指定为返回对象的属性),而不是酒店名称和描述,您可以从参数HotelName的参数值中指定。像

这样的东西
function hotelQuery(hotelName) {
    return {
        name: hotelName,
        desc: 'Hotel Desciption' + hotelName,
        // Keep prices as numbers and have a function to display them 
        // in the culture specific way. Numbers for prices will be easier to deal with
        price: [980, 1300, 1600, 1500, 1800, 300, 150, 200],
        roomType: ['Single Room', 'Delux Room','Twin Room', 'Matrimonial Room', 'Presidential Suites', 'Extra Bed', 'Free Breakfast', 'Extra Person']
    } 
}

答案 1 :(得分:8)

几个问题。

1)函数不需要在$(document).ready内,摆脱它。


2)每个案例陈述后面都应该跟break,而不是孤独的;。例如:

function HotelQuery(HotelName) {
    switch (HotelName) {
    case 'TetrisHotel': 
        // stuff goes here ...  
        break; //end Tetris Hotel 
    };
}

3)在alert处理程序中:后面不应该跟onclick

alert: (strHotelName, strHotelDesc, strHotelPrice);

应该是

alert(strHotelName, strHotelDesc, strHotelPrice);

此外,alert只接受一个参数,因此您需要将其分解:

alert(strHotelName); alert(strHotelDesc); alert(strHotelPrice);

3)您假设strHotelNamestrHotelDescstrHotelPrice位于全球范围内,而不是。{/ p>


总而言之,你可能想尝试这样的事情:

<!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">

  function HotelQuery(HotelName) {
    var response = {
        strHotelName: '',
        strHotelDesc: '',
        strHotelPrice: [],
        strHotelRoomType: []
    };
   switch (HotelName) {
    case 'TimelessHotel': 
     response.strHotelName = 'Timeless Hotel';
     response.strHotelDesc = 'Hotel Description Timeless Hotel';
     response.strHotelPrice = ['980.00', '1,300.00', '1,600.00', '1,500.00', '1,800.00', '300.00', '150.00', '200.00'];
     response.strHotelRoomType = ['Single Room', 'Delux Room','Twin Room', 'Matrimonial Room', 'Presidential Suites', 'Extra Bed', 'Free Breakfast', 'Extra Person'];    
    break; //end Timeless Hotel

    case 'ParadiseInn': 
     response.strHotelName = 'Paradise Inn';
     response.strHotelDesc = 'Hotel Description Paradise Inn';
     response.strHotelPrice = ['980.00', '1,300.00', '1,600.00', '1,500.00', '1,800.00', '300.00', '150.00', '200.00'];
     response.strHotelRoomType = ['Single Room', 'Delux Room','Twin Room', 'Matrimonial Room', 'Presidential Suites', 'Extra Bed', 'Free Breakfast', 'Extra Person'];    
     break; //end Paradise Inn

    case 'TetrisHotel': 
     response.strHotelName = 'Tetris Hotel';
     response.strHotelDesc = 'Hotel Description Tetris Hotel';
     response.strHotelPrice = ['980.00', '1,300.00', '1,600.00', '1,500.00', '1,800.00', '300.00', '150.00', '200.00'];
     response.strHotelRoomType = ['Single Room', 'Delux Room','Twin Room', 'Matrimonial Room', 'Presidential Suites', 'Extra Bed', 'Free Breakfast', 'Extra Person'];    
     break; //end Tetris Hotel 

    case 'JamstoneInn': 
     response.strHotelName = 'Jamstone Inn';
     response.strHotelDesc = 'Hotel Description Jamstone Inn';
     response.strHotelPrice = ['980.00', '1,300.00', '1,600.00', '1,500.00', '1,800.00', '300.00', '150.00', '200.00'];
     response.strHotelRoomType = ['Single Room', 'Delux Room','Twin Room', 'Matrimonial Room', 'Presidential Suites', 'Extra Bed', 'Free Breakfast', 'Extra Person'];    
     break; //end Jamstone Inn 
   }

   return response;
  };

  $(document).ready(function() {
      var infoContainer = $('#hotel-information');
      $("#hotel-query").click(function() {
          var info = HotelQuery('TetrisHotel');
          infoContainer.text(info.strHotelName);
      });
  });
  </script>     

<title>hotel query</title>
</head>

<body>
  <a href="#" id="hotel-query">Tetris Hotel Query</a>
  <p id="hotel-information"></p>
</body>
</html>

答案 2 :(得分:2)

alert("myVar1= " + myVar1 +"/n"+ "myVar2= " + myVar2);

在警告框中将字符串放置在字符串的一侧将允许您在警告框中显示多个具有漂亮换行符的变量。

myVar1= Data
myVar2= more Data

答案 3 :(得分:0)

我做了一些改变。

HotelQuery功能从ready功能中拉出来。

其次,所有这些变量都会在您进行警报呼叫时超出范围。如果你希望它们在范围内,请在全局范围内(在函数之外)声明它们并将它们设置在函数内。

var name;

function doStuff() {
  name = "reggie";
}