[英]Related Radio buttons and Drop down list
i am trying to make a form, in which i have a number of radio buttons (created dynamically), and a drop down list. 我正在尝试制作一个表单,其中有多个单选按钮(动态创建)和一个下拉列表。
In the drop down list i have numbers. 在下拉列表中,我有数字。 I want the drop down list to depend on the radio button currently pressed, meaning that, if i press the first button, the maximum number appearing in the drop down list will be a value x, if i press another radio will be a value y. 我希望下拉列表取决于当前按下的单选按钮,这意味着,如果我按下第一个按钮,则下拉列表中出现的最大数字将是值x,如果我按下另一个单选按钮将是值y 。 This values represent a php variable. 此值表示一个php变量。
What is the easiest way to do this thing? 做这件事的最简单方法是什么?
Thank you! 谢谢!
Editing: 编辑:
i tried: 我试过了:
<html>
<head>
<style>
#ca {
display: none;
}
</style>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js" type="text/javascript"></script>
<script>
$(document).ready(function() {
$("input:radio").click(function() {
$('.searchSelect').hide();
$('#' + $(this).attr("value")).show();
});
});
</script>
</head>
<body>
<ul id="countrylist">
<li>
<label for="US-country">
<input name="store" id="US-country" type="radio" value="com" checked="checked" />
USA</label>
</li>
<li>
<label for="CA-country">
<input name="store" id="CA-country" type="radio" value="ca"/>
Canada</label>
</li>
</ul>
<select name="search-alias-us" id="com" class="searchSelect" title="Search in">
<option value="aps" selected="selected">All Departments</option>
<option value="apparel">Apparel & Accessories</option>
<option value="automotive">Automotive</option>
</select>
<select name="search-alias-ca" id="ca" class="searchSelect" title="Search in">
<option value="aps" selected="selected">All Departments</option>
<option value="stripbooks">Books</option>
<option value="popular">Music</option>
</select>
</body>
</html>
also included : the jquery 1.5 library . 还包括:jquery 1.5库。 still, the drop down list does't change on radio button click. 仍然,单选按钮单击后,下拉列表不会更改。
thank you! 谢谢!
I'm not sure if I understand your question right but I once made something similar, what I did was output all dropdownlists and hid them with css then on clicking the radiobutton unhid the dropdownlist I needed using jquery 我不确定我是否正确理解了您的问题,但是我曾经做过类似的事情,我所做的是输出所有下拉列表并用css隐藏它们,然后单击单选按钮取消隐藏我需要使用jquery的下拉列表
http://jsfiddle.net/6svcD/ http://jsfiddle.net/6svcD/
It can be even shorter with show() and hide() 使用show()和hide()甚至可以更短
$(function() {
$("input:radio").click(function () {
$('.searchSelect').hide();
$('#' + $(this).attr("value")).show();
});
});
The whole page below or here: http://jsfiddle.net/MrAGF/1/ 以下或此处的整个页面: http : //jsfiddle.net/MrAGF/1/
<html>
<head>
<style>
#ca {
display: none;
}
</style>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js" type="text/javascript"></script>
<script>
$(document).ready(function() {
$("input:radio").click(function() {
$('.searchSelect').hide();
$('#' + $(this).attr("value")).show();
});
});
</script>
</head>
<body>
<ul id="countrylist">
<li>
<label for="US-country">
<input name="store" id="US-country" type="radio" value="com" checked="checked" />
USA</label>
</li>
<li>
<label for="CA-country">
<input name="store" id="CA-country" type="radio" value="ca"/>
Canada</label>
</li>
</ul>
<select name="search-alias-us" id="com" class="searchSelect" title="Search in">
<option value="aps" selected="selected">All Departments</option>
<option value="apparel">Apparel & Accessories</option>
<option value="automotive">Automotive</option>
</select>
<select name="search-alias-ca" id="ca" class="searchSelect" title="Search in">
<option value="aps" selected="selected">All Departments</option>
<option value="stripbooks">Books</option>
<option value="popular">Music</option>
</select>
</body>
</html>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.