weather.html 3.52 KB
<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8" />
    <title></title>
    <script src="../../js/jquery-3.4.1.min.js"></script>
    <script src="../../js/JavaScript.js"></script>
    <script src="../../js/popupJS.js"></script>
    <link rel="stylesheet" href="../../css/layer.css">

    <script src="/static/js/layui/layui.js"></script>
    <link rel="stylesheet" href="/static/js/layui/css/layui.css">

    <style>
        .row {
            margin-top: 5px;
        }

        .demo-slider {
            width: 200px;
        }
    </style>
</head>

<body marginwidth="0" marginheight="0">

    <div id="mainDiv" class="dialog tianqi">
        <h1 class="title" onmousedown="MouseDown(event)" onmouseup="MouseUp(event)" onmouseout="MouseUp(event)">
            天气<i class="guanbibtn" onclick="Close()">X</i>
        </h1>
        <form class="layui-form" action="">
            <div class="main">
                <div class="row">
                    <input type="checkbox" name="weather[fog]" lay-filter="fog" title="雾">
                    <div class="demo-slider" id="slideFog"></div>
                </div>
                <div class="row">
                    <input type="checkbox" name="weather[rain]" lay-filter="rain" title="雨">
                    <div class="demo-slider" id="slideRain"></div>
                </div>
                <div class="row">
                    <input type="checkbox" name="weather[snow]" lay-filter="snow" title="雪">
                    <div class="demo-slider" id="slideSnow"></div>
                </div>
            </div>
        </form>


    </div>

</body>
<script>
    layui.use(['form', 'slider'], function () {
        var form = layui.form;
        var $ = layui.$;
        var slider = layui.slider;
        var sgworld = CreateSGObj();
        form.on('checkbox(fog)', function (data) {
            // console.log(data.elem); //得到checkbox原始DOM对象
            // console.log(data.elem.checked); //是否被选中,true或者false
            // console.log(data.value); //复选框value值,也可以通过data.elem.value得到
            // console.log(data.othis); //得到美化后的DOM对象
            if (data.elem.checked) {
                sgworld.Command.Execute(2208, 1);
            } else {
                sgworld.Command.Execute(2208, 0);
            }
        });
        slider.render({
            elem: '#slideFog'
            , min: 0 //最小值
            , max: 100 //最大值
            , change: function (value) {
                sgworld.Command.Execute(2204, value);
            }
        });


        form.on('checkbox(rain)', function (data) {
            if (data.elem.checked) {
                sgworld.Command.Execute(2206, 1);

            } else {
                sgworld.Command.Execute(2206, 0);

            }
        });

        slider.render({
            elem: '#slideRain'
            , min: 20 //最小值
            , max: 100 //最大值
            , change: function (value) {
                sgworld.Command.Execute(2200, value);
            }
        });

        form.on('checkbox(snow)', function (data) {
            if (data.elem.checked) {
                sgworld.Command.Execute(2207, 1);

            } else {
                sgworld.Command.Execute(2207, 0);

            }
        });

        slider.render({
            elem: '#slideSnow'
            , min: 20 //最小值
            , max: 100 //最大值
            , change: function (value) {
                sgworld.Command.Execute(2201, value);
            }
        });


    });

</script>

</html>