JQuery应用：实现下拉列表选择一项，然后在第二个下拉列表显示全部。谢谢了 请一定帮我做一下！200分！
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了JQuery应用：实现下拉列表选择一项，然后在第二个下拉列表显示全部。谢谢了 请一定帮我做一下！200分！相关的知识，希望对你有一定的参考价值。
题目我们的一个JQuery考试题目，我做不出来。所以请大家一定帮我做一下。
如图1：
~下拉列表主选项里面有4个选项，是单选下拉列表。点击水果一个选项后，子选项出现如图2那样的4个选项，并且这个选项是多选的。同理选择蔬菜，家电，数码，都会在子选项里面显示4个不同的选项。我写了界面代码在下面，帮我写一下逻辑语言，要求是用首选JQuery来实现，如果不能用JQuery实现，就用javascript实现。
~~家电，蔬菜，数码，我还没有添加文字，我不知道是否该继续创建下拉列表来，还是用怎么弄。所以到时候，大家随便给我写一下文字就行了。
~这里有个问题：子选项应该要求是显示出的单选框，但是我把子选项改成单选下拉列表的时候，它的下拉是往上显示的，如图3，可以不可以把它的下拉往下面啊，实在太难看了。随便解决一下这个问题吧。
图1：
图2：
图3：
界面代码如由于字数限制，我存在云盘，请下下来用JQuery帮我实现一下：http://pan.baidu.com/s/1qWKPyl2
实在感谢了！！200分！
<script>
$(function()
var arr = [['苹果','西瓜','菠萝','梨子'],['西红柿','黄瓜'],['电视机','洗衣机','电冰箱'],['手机','相机']];
$('#select1').on('change',function()
$('#select2').empty();
var val = parseInt($(this).val());
var html = '';
for(var i=0;i<arr[val].length;i++)
html += '<option name="'+arr[val][i]+'">'+arr[val][i]+'</option>';
$('#select2').html(html);
);
);
</script>
</head>
<body>
<div class="div1">jQ下拉分类</div><br>
<div class="div">
<div class="div2">
<p><label for="select1">主选项:</label></p>
<select name="select" id="select1">
<option name="水果" value='0' selected="selected" >水果</option>
<option name="蔬菜" value='1'>蔬菜</option>
<option name="家电" value='2'>家电</option>
<option name="数码" value='3'>数码</option>
</select>
</div>
<div class="div2">
<p><label for="select2">子选项:</label></p>
<select name="select" id="select2" >
<option name="苹果" selected="selected">苹果</option>
<option name="西瓜">西瓜</option>
<option name="菠萝">菠萝</option>
<option name="梨子">梨子</option>
</select>
</div>
</div>
</body>追问
啊~ 点击采纳的时候怎么点错了，点到别人的头上去了~ 实在对不住哈，实在不好意思。我学习需要经常在知道上面向你们求助，关注我哈，还有很多请你帮忙的。
参考技术A第一个在帮你做。
第二个。css没写好。。
$(function()var arr=[
"水果":["苹果","西瓜","菠萝","梨子"],
"蔬菜":["青菜","白菜","萝卜","辣椒"],
"家电":["电视","冰箱","烤箱","洗衣机"],
"数码":["手机","相机","MP3","iPod"]
];
$('#select1').change(function()
var cate = $(this).val();
var list = arr[0][cate];
var l = list.length;
var dom = ""
for(var i = 0;i<l;i++)
dom += '<option name="'+list[i]+'">'+list[i]+'</option>';
$('#select2').html(dom);
)
)
第二个。你给select加个样式 vertical-align:top;就可以了。
本回答被提问者采纳使用 Jquery、mysql 和 php 我需要一个下拉选择的结果来更改第二个下拉列表中的选择
【中文标题】使用 Jquery、mysql 和 php 我需要一个下拉选择的结果来更改第二个下拉列表中的选择【英文标题】：Using Jquery, mysql, and php I need the results of one dropdown select to alter the choices in a second dropdown 【发布时间】：2012-04-01 11:07:22 【问题描述】：我的表单中有 2 个下拉选择框。第一个允许用户选择汽车制造商“vmake”。一旦选择了 vmake，“vmodel”选择框就会凭空出现，然后用户可以选择 vmodel。但是，我希望 vmodel 框在页面加载时出现，所以它不会凭空出现。如果用户在选择 vmake 之前尝试打开它，它将是空的。这是我的html
<select name="vmake" id="vmake">
<option value"" selected="selected">Make</option>
<?php getTierOne()l ?>
</select>
<select name="vmodel" id="vmodel">
<option value"" selected="selected">Model</option>
</select>
<span id="wait_1"></span>
<span id="result_1"></span>
这是 jquery：
$(document).ready(function()
$('#wait_1').show();
$('#vmake').change(function()
$('#wait_1').show();
$('#result_1').hide();
$.get("func.php",
func" "vmake",
drop_varL $('#vmake').val()
, function(response)
$('#result_1').fadeOut();
setTimeout(finishAjax('result_1', '"+escape(response)+"')", 400);
);
return false;
]);
);
最后是连接到我的数据库的php
function getTierOne()
$result = mysql_query("SELECT DISTINT vmake FROM vmake")
or die(mysql_error());
while($tier = mysql_fetch_array( $result ))
echo '<option value="'.tier['vmake'].'">'.$tier['vmake'].'</option>';
if($_GET['func'] == "vmake" && isset ($_GET['func']))
vmake($_GET['drop_var']);
function vmake($drop_var)
include_once('db.php');
$result = mysql_query("SELECT * FROM vmake WHERE vmake='$drop_var'")
or die(mysql_error());
echo '<option value=" " selected="selected">Model</option>';
while($drop_2 = mysql_fetch_array( $result))
echo '<option value="'.$drop_2['vmodel'].'">'.$drop_2['vmodel'].'</option>';
我在开源网站的原始代码方面得到了一些帮助，现在我只需要对其进行一些更改以使其符合我的要求。就目前而言，它将在现有的旁边创建一个新的 vmodel 选择框，但我只希望它填充页面加载时出现的选择框。很感谢任何形式的帮助。谢谢你的一切。
【问题讨论】：
【参考方案1】：您是否尝试过使用 jQuery .load？
例子：
$('#vmodel').load('func.php',vmake:$('#vmake').val());
还需要更改 PHP，因此您创建一个正常的值数组，然后通过 json_encode() 发送它。
【讨论】：
以上是关于JQuery应用：实现下拉列表选择一项，然后在第二个下拉列表显示全部。谢谢了 请一定帮我做一下！200分！的主要内容，如果未能解决你的问题，请参考以下文章
如何在 Django 中使用 Ajax JQuery 调用下拉列表 html 选择