将JavaScript数组转换为下拉列表 - jquery [英] converting javascript array to a dropdown - jquery

查看:91
本文介绍了将JavaScript数组转换为下拉列表 - jquery的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述



假设我有一个包含三个值的下拉列表,分别是一个两个三个



当我选择一个时。我有一个javascript数组,并且该数组中的值需要作为网页中的第二个下拉菜单出现。



以下是 小提琴



我没有想法从哪里开始或如何开始。



我使用Google搜索,结果是使用 ul 创建了一个下拉菜单,不是来自javascript数组。



任何帮助对我来说都是非常有帮助的。



Stuck 2天,我仍然没有得到任何想法如何做到这一点。



预先致谢。

解决方案

这可以改进,但这应该指向正确的方向。这是 js小提琴

 < script src ='jquery.js'>< / script> 

< select class =dropdown>
< option value =1>一个< / option>
< option value =2>两个< / option>
< option value =3>三< / option>
< / select>
< select class =dropdown2>
< / select>

< script>
$(document).ready(function(){
var dropdown2 = {
1:['Four','Five','Six'],
2:[ '七','八','九'],
3:['十','十一','十二']
}
$('。dropdown')。 ('change',function(){
$('。dropdown2')。html(
'< option>'+ dropdown2 [$(this).val()]。join('< ; / option>< option>')+'< / option>'
);
});
});
< / script>


I wanted to create dynamic dropdowns in which the values are changed based on the first dropdown.

Suppose I have a dropdown with three values namely One, Two and Three.

When I select One. I have a javascript array and that values in that array needs to be appeared as a second dropdown in the webpage.

Here's the Fiddle.

I have no idea where to start or how to start.

I googled and the result i got is creating a dropdown using ul not from a javascript array.

Any help will be very much helpful for me to overcome this.

Stuck for 2 days and I still didn't get any idea on how to do it.

Thanks in advance.

解决方案

this could be improved upon, but this should point you in the right direction. Here's the js fiddle

<script src='jquery.js'></script>

<select class="dropdown">
    <option value="1">One</option>
    <option value="2">Two</option>
    <option value="3">Three</option>
</select>
<select class="dropdown2">
</select>

<script>
$(document).ready(function() {
  var dropdown2 = {
    1 : ['Four', 'Five', 'Six'],
    2 : ['Seven', 'Eight', 'Nine'],
    3 : ['Ten', 'Eleven', 'Twelve']
  }
  $('.dropdown').on('change',function() {
    $('.dropdown2').html(
      '<option>'+dropdown2[$(this).val()].join('</option><option>')+'</option>'
    );
  });
});
</script>

这篇关于将JavaScript数组转换为下拉列表 - jquery的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆