JavaScript 的基本用法(六)：簡單練習，有助於理解js
阿新 • • 發佈：2018-11-11
1 按下Ctrl鍵，使在下表中“操作”列中選擇同時使被勾選的那些行，獲得同樣的選擇？
<!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="UTF-8"> <title>網咖管理系統</title> </head> <body> <table border="1px" > <thead> <tr> <th>#</th> <View Codeth>機號</th> <th>操作</th> </tr> </thead> <tbody> <tr> <td><input title="勾選" type="checkbox"></td> <td>1</td> <td> <selecttitle="操作" name="state" id="select0"> <option value="0">離線</option> <option value="1">上線</option> <option value="2">下線</option> </select> </td> </tr> <tr> <td><input title="勾選" type="checkbox"></td> <td>2</td> <td> <select title="操作" name="state" id="select1"> <option value="0">離線</option> <option value="1">上線</option> <option value="2">下線</option> </select> </td> </tr> <tr> <td><input title="勾選" type="checkbox"></td> <td>3</td> <td> <select title="操作" name="" id="select2"> <option value="0">離線</option> <option value="1">上線</option> <option value="2">下線</option> </select> </td> </tr> <tr> <td><input title="勾選" type="checkbox"></td> <td>4</td> <td> <select title="操作" name="" id="select3"> <option value="0">離線</option> <option value="1">上線</option> <option value="2">下線</option> </select> </td> </tr> <tr> <td><input title="勾選" type="checkbox"></td> <td>5</td> <td> <select title="操作" name="" id="select4"> <option value="0">離線</option> <option value="1">上線</option> <option value="2">下線</option> </select> </td> </tr> <tr> <td><input title="勾選" type="checkbox"></td> <td>5</td> <td> <select title="操作" name="" id="select5"> </select> </td> </tr> </tbody> </table> <script src="jquery-3.2.1.min.js"></script> <script> $("document").ready(function () { var keyOnctrl=false; $bodyEle= $("body"); $bodyEle.on("keydown",function (event) { if (event.keyCode === 17) { keyOnctrl = true; console.log(event.keyCode) } }); $bodyEle.on("keyup",function (event) { if (event.keyCode === 17) { keyOnctrl = false; console.log(event.keyCode) } } ) $selectEles=$("select"); $selectEles.on("change",function () { if (keyOnctrl===true){ check_val=this.value; console.log(this,check_val); $("input[type='checkbox']:checked").parentsUntil("tbody").find('select').val(check_val) } }) }) </script> </body> </html>