美文网首页webAPI
随机下拉框选中

随机下拉框选中

作者: 椋椋夜色 | 来源:发表于2019-05-07 22:59 被阅读0次

    <!DOCTYPE html>
    <html lang="zh-CN">

    <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title> 随机下拉框选中 </title>

    </head>

    <body>

    <input type="button" value="随机选中" id="ben">
    <select>
        <option>西施</option>
        <option>王昭君</option>
        <option>貂蝉</option>
        <option>杨玉环</option>
    </select>
    <!-- 
        要点击按钮的时候,随机给一个option加selected属性
     -->
    <script>
        //找到所有option
        var opList = document.getElementsByTagName('option');
        //点击事件
        document.getElementById('ben').onclick = function () {
            //产生一个随机下标,范围在 0 - option长度-1 之间
            var sui = parseInt(Math.random() * opList.length);
    
            opList[sui].selected = true;
        }
        //Math.random() 生成 0 - 0.999999999 之间
        //乘以100
        // 0 - 99.999999之间
        // Math.ceil向上取整后,就变 0 - 100之间,不太好的地方是,0的随机概率特别的低
        // 但是parseInt后,就变 0 - 99 这个时候0的概率就跟大家一样
        // 所以如果想0-100 就 Math.random() * 101 会变 0 - 100.99999之间
        // 直接取整0 - 100之间了
        // 结论:如果想得到 0 - n 之间的随机数 那么就用 parseInt( Math.random() * (n+1) )
    </script>
    

    </body>

    </html>

    相关文章

      网友评论

        本文标题:随机下拉框选中

        本文链接:https://www.haomeiwen.com/subject/zswuoqtx.html