2017阿里前端内推在线编程

最新推荐文章于 2024-05-11 15:49:20 发布

R_renee

最新推荐文章于 2024-05-11 15:49:20 发布

阅读量1.2k

点赞数

分类专栏：前端-面试前端-练习文章标签：前端编程

本文链接：https://blog.csdn.net/R_renee/article/details/62423476

版权

前端-练习同时被 2 个专栏收录

1 篇文章 0 订阅

订阅专栏

前端-面试

0 篇文章 0 订阅

订阅专栏

题目：按要求完成一个select下拉框

<!DOCTYPE html>
<head>
  <meta charset="UTF-8">
  <title>body</title>
  <style>
      /* your code here */
  </style>
</head>
<body>
  <div id="select"></div>

  <script>
        function select(options){
          // your code here

    }

    select({
        srcNode : '#select',
        data : [ '北京', '上海', '杭州' ],
        onChange : function(ev) {
            console.log(ev.value);
        }
    });
  </script>
</body>
</html>

答案：

function select(options) {
        var $select = document.getElementById('select');
        var data = options.data || [];
        var innerstr = ''; //define select modal
        innerstr += '<select id="test" style="width: 250px;">';
        for (var i = 0, l = data.length; i < l; i++) {
            innerstr += '<option value="' + data[i] + '" label="' + data[i] + '"/>';
        }
        innerstr += '<select>'
        $select.innerHTML = innerstr;
        var sl = document.getElementById("test");
        sl["onchange"] = function(e) {
            options.onChange(sl.options[sl.selectedIndex]);
        };
    }