0

我需要一些认真的帮助！我正在尝试创建一个酒店搜索引擎。我需要从选择框中获取房间数，并克隆选择框的 div，其次数与在房间选择框中选择的次数相同。我希望这是有道理的。我还需要将 div 的文本更改为 Room 1、Room 2、Room 3 等。这是我已经开始的一个 jsfiddle，我不知道从哪里开始。 http://jsfiddle.net/liveandream/YxXtY/ 这是我的代码：HTML：

Rooms:<select name="rooms" id='rooms'>
        <option>1</option>
        <option>2</option>
        <option>3</option>
        <option>4</option>
      </select><br>
<div id="room">Room 1:
<br />
<div class='left' >Adults:
    <select name="adults" id='adults'>
        <option>1</option>
        <option>2</option>
        <option>3</option>
        <option>4</option></select></div>
 <div class='left'>Children:
   <select name="children" id="children">
        <option selected="selected">0</option>
        <option>1</option>
        <option>2</option>
        <option>3</option>
    </select></div>
<div class='left' id="childage">Child Ages:
    <select name="children" >
        <option selected="selected">0</option>
        <option>1</option>
        <option>2</option>
        <option>3</option>
    </select></div><br clear="all" /></div>
<div id="txt"></div>

​查询：

$("select#rooms").change(function () {
          var str = "";
          $("select#rooms option:selected").each(function () {
                $("#room").clone(2).insertAfter("#txt");
              });
          $("#txt").text(str);
        })
        .change();​

提前感谢任何愿意提供帮助的人！

编辑：我需要它是这样的：http ://www.helloweekends.com/

4

2 回答 2

1

我已经在http://jsfiddle.net/ryanfernandes/YxXtY/81/更新了你的 jsfiddle看看它是否是你要找的。

我修改了 html，以便您的 div 具有唯一的 ID，并包含根据所选数字删除/隐藏房间的功能。

于 2012-04-11T09:49:05.900 回答
0

与其仅仅从现有的 HTML 中复制元素，不如使用 JavaScript 创建这些元素。因此，对于您在更改所选房间数量时调用的函数，例如

 function () {
    var html = "";
    var i;
    for(i = 0; i < this.value; i++)
    {
       html += "<div class='room'>Room " + (i + 1);
       html += "<br clear='all' />";   
       html += "<div class='left' >Adults:<select name='adults' id='adults'>";        

       // ... Create the rest of the form part for the room  ...

    }    
    $("#roomsContainer").html(html); // #roomsContainer is a container around where the
                                     // menus for the individual rooms should be. 
}
于 2012-04-11T04:14:16.580 回答