选择列表自动更新任何类型的更改
Select list auto update on any kind of change?
我有一个jQuery,当你点击一个选择选项时,它会显示下一个选项,但你必须点击,你不能只使用向下箭头或"tab"到下一个选项。我想知道我有什么选择来完成这项工作?
这是我的jQuery:
function typefunction()
{
var itemTypes = jQuery('#type');
var select = this.value;
itemTypes.change(function () {
if ($(this).val() == '1-Hand') {
$('.1-Hand').show();
$('.2-Hand').hide();
$('.off').hide();
$('.Armor').hide();
}
else $('.1-Hand').hide();
if ($(this).val() == '2-Hand') {
$('.2-Hand').show();
$('.1-Hand').hide();
$('.off').hide();
$('.Armor').hide();
}
else $('.2-Hand').hide();
if ($(this).val() == 'Armor') {
$('.Armor').show();
$('.2-Hand').hide();
$('.off').hide();
$('.1-Hand').hide();
}
else $('.Armor').hide();
if ($(this).val() == 'Off-Hand') {
$('.Off').show();
$('.2-Hand').hide();
$('.1-Hand').hide();
$('.Armor').hide();
}
else $('.Off').hide();
if ($(this).val() == '1-Hand') {
$('.one-hand-dps').show();
$('.item-armor').hide();
$('.two-hand-dps').hide();
}
else $('.one-hand-dps').hide();
if ($(this).val() == '2-Hand') {
$('.two-hand-dps').show();
$('.one-hand-dps').hide();
$('.item-armor').hide();
}
else $('.two-hand-dps').hide();
if ($(this).val() == 'Armor') {
$('.item-armor').show();
$('.one-hand-dps').hide();
$('.two-hand-dps').hide();
}
else $('.item-armor').hide();
});
}
和 HTML:
<div class="input-group item">
<span class="input-group-addon">Type</span>
<select id="type" name="type" class="form-control" onclick="typefunction(); itemstats(); Armor(); OffHand(); TwoHand();">
<option value="Any Type">Any Type</option>
<option value="1-Hand">1-Hand</option>
<option value="2-Hand">2-Hand</option>
<option value="Armor">Armor</option>
<option value="Off-Hand">Off-Hand</option>
</select>
</div>
<div class="input-group item">
<span class="1-Hand input-group-addon" style="display: none;">Sub-Type</span>
<select class="1-Hand form-control" name="sub[1]" style="display: none;">
<option value="All 1-Hand Item Types">All 1-Hand Item Types</option>
<option>Axe</option>
<option>Ceremonial Knife</option>
<option>Hand Crossbow</option>
<option>Dagger</option>
<option>Fist Weapon</option>
<option>Mace</option>
<option>Mighty Weapon</option>
<option>Spear</option>
<option>Sword</option>
<option>Wand</option>
</select>
</div>
<div class="input-group">
<span class="2-Hand input-group-addon" style="display: none; ">Sub-Type</span>
<select class="2-Hand form-control" name="sub[2]" style="display: none;">
<option>All 2-Hand Item Types</option>
<option>Two-Handed Axe</option>
<option>Bow</option>
<option>Diabo</option>
<option>Crossbow</option>
<option>Two-Handed Mace</option>
<option>Two-Handed Mighty Weapon</option>
<option>Polearm</option>
<option>Staff</option>
<option>Two-Handed Sword</option>
</select>
</div>
<div class="input-group">
<span class="Armor input-group-addon" style="display: none;">Sub-Type</span>
<select class="Armor form-control" name="sub[3]" style="display:none;">
<option>All Armor Item Types</option>
<option>Amulet</option>
<option>Belt</option>
<option>Boots</option>
<option>Bracers</option>
<option>Chest Armor</option>
<option>Cloak</option>
<option>Gloves</option>
<option>Helm</option>
<option>Pants</option>
<option>Mighty Belt</option>
<option>Ring</option>
<option>Shoulders</option>
<option>Spirit Stone</option>
<option>Voodoo Mask</option>
<option>Wizard Hat</option>
</select>
</div>
<div class="input-group">
<span class="Off input-group-addon" style="display: none;">Sub-Type</span>
<select class="Off form-control" name="sub[4]" style="display:none;">
<option>All Off-Hand Item Types</option>
<option>Mojo</option>
<option>Source</option>
<option>Quiver</option>
<option>Shield</option>
</select>
</div>
如果您在选择中使用 onclick 属性,那么它需要单击鼠标才能工作。例如,尝试使用onchange,键盘使用也应该有效。
<select id="type" name="type" class="form-control" onchange="typefunction(); itemstats(); Armor(); OffHand(); TwoHand();">
<option value="Any Type">Any Type</option>
<option value="1-Hand">1-Hand</option>
<option value="2-Hand">2-Hand</option>
<option value="Armor">Armor</option>
<option value="Off-Hand">Off-Hand</option>
</select>
另请参阅此问题,了解有关如何立即处理单击和键的更多详细信息。
相关文章:
- 是否有任何可能的原因使我应该指定类型=“”;按钮“;用于我的按钮元素
- 在javascript中调用函数/对象引用时,可容纳任何数据类型
- 在scala或scalajs Diode中,现有类型中的任何一种都符合“;更新一个没有'还不存在”;
- 当我单击chrome的输入类型=搜索元素上的X时,是否触发了任何事件
- 完全禁用DIV中的任何类型的垂直滚动
- 我可以在ebay中使用谷歌网页字体api或任何类型的自定义字体吗
- 有没有任何方法可以从javascript进行跨域请求,并访问它可能生成的错误响应类型(401404等)
- 提交输入类型=“;图像“;到另一个servlet时,未能返回任何参数
- websocketapi-图像编码在客户端不产生任何图像类型
- 对jQuery使用setTimeout()是否有任何问题;媒体查询“;类型情况
- TypeScript-如何定义具有任何类型参数的函数类型
- 获取成员数据模型中任何属性的属性类型
- 在 CreateJS 中显示未捕获的类型错误.下面给出了不显示任何 output.my 代码
- “'值' == 类型X ”VS 类型X == '值'“的任何差异
- 选择列表自动更新任何类型的更改
- 火狐插件 - 无法触发任何类型的点击事件
- 输入类型“文本”的 ng-init 不会在文本框内显示任何数据
- 单击输入类型=搜索时重置按钮的任何事件
- 从Node.js客户端使用Aerospike LDT(大型数据类型)的任何方法
- 关于如何刷新此验证码类型的任何想法