• 按键批量操作示例


    <!DOCTYPE html>
    <html lang="en">
    <head>
    <meta charset="UTF-8">
    <title>jianpan</title>
    </head>
    <body>
    <table border="2">
    <thead>
    <th>option</th>
    <th>name</th>
    <th>hobby</th>
    <th>operation</th>
    </thead>
    <tbody>
    <tr>
    <td><input type="checkbox"></td>
    <td>1</td>
    <td>1</td>
    <td><select>
    <option value="1">online</option>
    <option value="2">offline</option>
    <option value="3">shutdown</option>
    </select></td>
    </tr>
    <tr>
    <td><input type="checkbox"></td>
    <td>1</td>
    <td>1</td>
    <td><select>
    <option value="1">online</option>
    <option value="2">offline</option>
    <option value="3">shutdown</option>
    </select></td>
    </tr>
    <tr>
    <td><input type="checkbox"></td>
    <td>1</td>
    <td>1</td>
    <td><select>
    <option value="1">online</option>
    <option value="2">offline</option>
    <option value="3">shutdown</option>
    </select>
    </td>
    </tr>
    <tr>
    <td><input type="checkbox"></td>
    <td>1</td>
    <td>1</td>
    <td><select>
    <option value="1">online</option>
    <option value="2">offline</option>
    <option value="3">shutdown</option>
    </select></td>
    </tr>
    <tr>
    <td><input type="checkbox"></td>
    <td>1</td>
    <td>1</td>
    <td><select>
    <option value="1">online</option>
    <option value="2">offline</option>
    <option value="3">shutdown</option>
    </select></td>
    </tr>
    </tbody>
    </table>
    <script src="jquery-3.4.1.js"></script>
    <script>
    var mode = false;
    //先判断要求1按键是否按下
    var $bodyEle = $('body');
    $bodyEle.on('keydown',function (event) {
    if(event.keyCode===17){
    mode = true;
    //进入批量操作模式
    }
    });

    $bodyEle.on('keyup',function (event) {
    if(event.keyCode===17){
    mode = false;
    }
    });

    $('select').on('change',function () {
    //先获取当前SELECT的值
    var value = $(this).val();
    //找到CHECKBOX标签
    var $thischenckbox = $(this).parent().siblings().first().find(':checkbox');
    //判断checkbox是否被选中
    if($thischenckbox.prop('checked') && mode){
    //满足checkbox被选中与按键基本要求
    //正式进入批量操作模式
    var $checked = $("input[type='checkbox']:checked");
    for(var i=0;i<$checked.length;i++){
    $($checked[i]).parent().siblings().last().find("select").val(value);
    }
    }
    })
    </script>
    </body>
    </html>
  • 相关阅读:
    AOSP 设置编译输出目录
    android stadio 编译报错:download fastutil-7.2.0.jar
    Ubuntu adb 报错:no permissions (user in plugdev group; are your udev rules wrong?);
    Ubuntu 18启动失败 Started Hold until boot procss finishes up
    算法---------两数之和
    Windows 显示环境变量
    Android ObjectOutputStream Serializable引发的血案
    (AOSP)repo checkout指定版本
    如果看懂git -help
    Android stado 运行项目,apk does not exist on disk.
  • 原文地址:https://www.cnblogs.com/njuwyx/p/11656442.html
Copyright © 2020-2023  润新知