如何通过选定的选项显示div（s）？

我有一个包含客人的数量为一个房间，我需要保持一个选择列表，代码：如何通过选定的选项显示div（s）？

<select name="txtHotelGuestNO" id="txtHotelGuestNO" class="hotels" onchange="show_room_choose()"> 
    <? for($i=1;$i<=100;$i++) echo "<option value=$i>$i</option>"; ?> 
    </select>

如果我选择2人，我只需要表现出与IDS的div 单和双这样的：

<div id="single"> ... code</div> 
<div id="double">... code</div>

如果我选择大于2，我们需要显示所有房型格。

如果我选择1个人，我只需要显示的单独格。

如何使用ajax做到这一点？

来源

2013-03-12 Khalid Ahmed

除非您要提取的数据室从服务器之后用户做出选择，AJAX不是适合这项工作的工具，它是JavaScript。 – 2013-03-12 19:47:43

它看起来不像你需要AJAX。 AJAX用于检索或发送数据到服务器。既然你已经在页面上看到了你需要的所有信息（你想要显示或隐藏的select和两个div），你不应该需要AJAX--准确地说它已经全部在页面上了？或者你的问题有什么缺失？ – 2013-03-12 19:50:57

如果你可以使用jQuery：

// Wait for DOM to be ready (if you are including the JavaScript before the HTML, ie the <head>) 
$(document).ready(function()) { 
    // listen for when the user changes the value in the <select> dropdown 
    $('#txtHotelGuestNO').change(function() { 

     // get value selected 
     var value = parseInt($(this).val(), 10); // parseInt() converts the value to integer (base 10) 

     if (value < 2) { 
      // single 
      $('#single').show(); 
      $('#double').hide(); 
     } else { 
      // double 
      $('#double').show() 
      $('#single').hide(); 
     } 
    }); 
});

您可以了解更多关于所使用的jQuery方法：

.change()：http://api.jquery.com/change/
.val()：http://api.jquery.com/val/
.show()：http://api.jquery.com/show/
.hide()：http://api.jquery.com/hide
.ready()：http://api.jquery.com/ready/

来源

2013-03-12 19:47:40 sweetamylase

都设置申报单显示：无和选择的值发送给您的onchange功能：

function show_room_choose(value) { 
    if(value==1) { 
      document.getElementById("single").style.display = "block"; 
      document.getElementById("double").style.display = "none"; 
    } else if(value==2) { 
      document.getElementById("single").style.display = "block"; 
      document.getElementById("double").style.display = "block"; 
    } else { 
      document.getElementById("single").style.display = "block"; 
      document.getElementById("double").style.display = "block"; 
      // add whatever other divs to show here 
    } 
}

来源

2013-03-12 19:58:38 TrippinBilly

如何通过选定的选项显示div（s）？

回答

相关问题