这是我的html.
<select id="type"> <option value="item1">item1</option> <option value="item2">item2</option> <option value="item3">item3</option> </select> <select id="size"> <option value="">-- select one -- </option> </select>
这是我尝试的jquery,但是不成功.
$(document).ready(function() {
if( $("#type").val("item1"))
{
$("#size").html("<option value='test'>test</option><option value="test2">test2</option>);
}
elseif( $("#type").val("item2"))
{
$("#size").html("<option value='anothertest1'>anothertest1</option>");
}
});
基本上我正在尝试做的是如果在#type中选择一个选项,那么大小选择将填充与其相关联的选项.我该怎么办？
谢谢
解决方法
以下是您尝试做的一个例子：
http://jsfiddle.net/YPsqQ/
$(document).ready(function () {
$("#type").change(function () {
var val = $(this).val();
if (val == "item1") {
$("#size").html("<option value='test'>item1: test 1</option><option value='test2'>item1: test 2</option>");
} else if (val == "item2") {
$("#size").html("<option value='test'>item2: test 1</option><option value='test2'>item2: test 2</option>");
} else if (val == "item3") {
$("#size").html("<option value='test'>item3: test 1</option><option value='test2'>item3: test 2</option>");
}
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<select id="type">
<option value="item1">item1</option>
<option value="item2">item2</option>
<option value="item3">item3</option>
</select>
<select id="size">
<option value="">-- select one -- </option>
</select>
