显示选择列表中的值jquery
问题描述:
我希望实现的目标是让几个选择列表相互连接,并且在用户从选择列表中选择适合他或她的所有参数列表后,我希望脚本显示选定参数的结果。现在我知道如何创建选择列表,但我不知道如何显示结果。显示选择列表中的值jquery
这里是我的代码的一部分,它仍然是未完成的,你可以选择只有前几个品牌和型号,但它应该告诉你什么即时通讯试图实现...即时通讯也计划包括可选的年份变化和修剪版。
<div class="articles">
<form method="GET" action=_output.html>
<table align="center">
<tr>
<th>
<label for="id_znamka_vozila">Znamka vozila:</label>
</th>
<td>
<select name="znamka_vozila" id="id_znamka_vozila">
<option value="">Izberite</option>
<option value="1">Alfa Romeo</option>
<option value="2">Aston Martin</option>
<option value="3">Audi</option>
<option value="4">Austin</option>
<option value="5">Autobianchi</option>
<option value="6">Bentley</option>
<option value="7">BMW</option>
<option value="8">Bugatti</option>
<option value="9">Buick</option>
<option value="10">Cadillac</option>
</select>
</td>
</tr>
<tr>
<th>
<label for="id_alfaromeo">Model vozila:</label>
</th>
<td>
<select name="alfaromeo" id="id_alfaromeo">
<option value="" selected="selected">Izberite</option>
<option value="33">33</option>
<option value="75">75</option>
<option value="90">90</option>
<option value="145">145</option>
<option value="146">146</option>
<option value="147">147</option>
<option value="155">155</option>
<option value="156">156</option>
<option value="159">159</option>
<option value="164">164</option>
<option value="166">166</option>
<option value="4C">4C</option>
<option value="8C">8C</option>
<option value="alfasud">Alfasud</option>
<option value="alfetta">Alfetta</option>
<option value="brera">Brera</option>
<option value="crosswagon">Crosswagon</option>
<option value="giulia">Giulia</option>
<option value="giulietta">Giulietta</option>
<option value="GT">GT</option>
<option value="GTV">GTV</option>
<option value="mito">Mito</option>
<option value="rzsz">RZ/SZ</option>
<option value="spider">Spider</option>(
<option value="sprint">Sprint</option>
</select>
</td>
</tr>
$(document).ready(function() {
var $alfaromeoTr = $('#id_alfaromeo').closest('tr').hide();
var $astonmartinTr = $('#id_astonmartin').closest('tr').hide();
var $audiTr = $('#id_audi').closest('tr').hide();
var $bentleyTr = $('#id_bentley').closest('tr').hide();
$('#id_znamka_vozila').change(function() {
var selectedValue = $(this).val();
if (selectedValue === '1') {
$astonmartinTr.hide();
$alfaromeoTr.show();
$bentleyTr.hide();
$audiTr.hide();
} else if (selectedValue === '2') {
$astonmartinTr.show();
$alfaromeoTr.hide();
$audiTr.hide();
$bentleyTr.hide();
} else if (selectedValue === '3') {
$audiTr.show();
$astonmartinTr.hide();
$alfaromeoTr.hide();
$bentleyTr.hide();
} else if (selectedValue === '6') {
$bentleyTr.show();
$audiTr.hide();
$astonmartinTr.hide();
$alfaromeoTr.hide();
} else {
$astonmartinTr.hide();
$alfaromeoTr.hide();
$audiTr.hide();
$bentleyTr.hide();
}
}
所以,主要的问题是,如何显示结果或特定网页,之后用户选择,型号(...一年,修剪,等等),从列表中。
答
你真的想用JavaScript解析数据而不使用任何服务器端语言(PHP,ASP等)吗?
如果你再对这个简单的例子看看:
Page1.htm
<HTML>
<HEAD>
<TITLE></TITLE>
<META NAME="GENERATOR" Content="Microsoft Visual Studio">
<META HTTP-EQUIV="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript">
function passValue(val)
{
if(!val)
{return false;}
document.forms[0].action = "Page2.htm?value=" + val;
return true;
}
</script>
</HEAD>
<BODY>
<form onsubmit="passValue(this.first_name.value)" method="post">
<input type="text" name="first_name" size="30">
<input type="submit" value="click me!">
</form>
</BODY>
</HTML>
Page2.htm
<HEAD>
<TITLE></TITLE>
<META NAME="GENERATOR" Content="Microsoft Visual Studio">
<META HTTP-EQUIV="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript">
window.onload = function()
{
var val = window.location.toString().substr(window.location.toString().indexOf('=') + 1);
document.body.appendChild(document.createTextNode("The value was: " + val));
}
</script>
</HEAD>
<BODY>
</BODY>
</HTML>
您可以通过该值作为行动的一部分字符串,因此它成为位置字符串的一部分,您可以在被叫页面中查看。
如果您想传递多个值,请将位置前端翻到'?'然后通过'='拆分()余数以获得传递的名称/值对的数组。
希望这有助于
“..如何显示结果...”。期望的结果是什么? – Sharun 2013-05-01 10:59:53
我想要选择列表值作为我的内容的过滤器,它将以分类添加的形式进行工作...因此,用户将选择选择列表中的所有参数,并在提交内容时以适当的方式过滤。 – 2013-05-01 11:47:09
我还没有得到你的问题。这些列表的形式是,那么你为什么不提交表单并在服务器中访问这些值? – Sharun 2013-05-02 03:25:46