Chinese
Sign in / Sign up

连锁选择框脚本

联动选择框可以在上级列表框值改变时修改下级列表框的显示项目。

特点

  • 使用这个脚本可以让你页面中的下拉列表框更加友好。
  • 联动列表框让你把表单上面的多个内容相关的列表框 “关联” 在一起。
  • 用于显示选中国家的城市列表框。
  • 这个脚本是简单和易用性。
  • 只要复制到您的页面代码和使用它。

预览

代码

Javascript 代码
<!-- Script by hscripts.com -->
<!-- copyright of HIOX INDIA -->
<!-- more scripts @ https://www.hscripts.com -->
<script type="text/javascript">
if (window.XMLHttpRequest)
{// code for IE7 , Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
function fillSelect(country) {
var url = "city.php?country=" escape(country);
xmlhttp.open("GET", url, true);
xmlhttp.onreadystatechange =go;
xmlhttp.send(null);
}
function go() {
if (xmlhttp.readyState == 4) {
if (xmlhttp.status == 200) {
var response = xmlhttp.responseText;
var list=document.getElementById("City");
var cities=response.split('|');
for (i=1; i<cities.length; i ) {
var x=document.createElement('option');
var y=document.createTextNode(cities[i]);
x.appendChild(y);
list.appendChild(x);
}
}
}
}
function display()
{
var country=document.getElementById('country');
country.onchange=function() {
if(this.value!="") {
var list=document.getElementById('City');
while (list.childNodes[0]) {
list.removeChild(list.childNodes[0]);
}
fillSelect(this.value);
}
}
fillSelect(country.value);
}
</script>

// php code
<?php
echo("ada");
$country=$_GET['country'];
echo($country);
function doIt($country) {
switch ($country) {
case "India":
return array('New Delhi','Mumbai','Kolkatta','Chennai');
break;
case "Pakistan":
return array('Islamabad','Karachi','Lahore');
break;
case "Srilanka":
return array('colombu','Trincomalee','kandy');
break;
}
}
$cities=doIt($country);
foreach ($cities as $city)
{
echo '|'.$city;
}
?>
<!-- Script by hscripts.com -->

HTML 代码
<body onload="display()">
<form name="select" id="select">
<select name="country" id="country">
<option>Select country</option>
<option>India</option>
<option>Pakistan</option>
<option>Srilanka</option>
</select>
<select name="City" id="City">
<option>Select City</option>
</select>
</form>
</body>
  • 发行日期 - 2010-09-09
  • 获得免费版本无版权链接只 $5/-
  • 关于脚本的定制或者任何脚本的开发，请联系我们, support@hscripts.com

用法

  • 复制并粘贴到您的HTML文件中的HTML和JavaScript代码，以利用这一链式selectboxes AJAX脚本使用。
  • 在 body 标记的 onload 事件中调用 display() 函数。
  • 复制 php 代码并存储为 city.php 文件，存放到你 html 文件所在的文件夹。
  • 你可以根据你的实际需要修改在 html 和 php 文件中的下拉列表的选项。

牌照

  • 本Ajax脚本/ HTML代码是GPL许可下给予.
  • 即免费使用那些谁使用，因为它是它.
  • 免费的，如果你的修改不会删除我们的版权信息和链接.
  • 详细许可证资料可在这里找到
  • 你可以购买脚本如果你的要求不符合GPL授权条款.

Ajax 脚本