键盘方向键事件以及验证

已于 2024-03-11 16:13:30 修改
阅读量354 收藏 9
点赞数 10
文章标签： 计算机外设 javascript 前端
于 2023-11-23 15:57:19 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/oxygensunshine/article/details/134579457
版权 
<el-table
          ref="singleTable"
          :data="ruleForm.tableData"
          :header-cell-style="{ textAlign: 'center' }"
          style="width: 100%"
          class="tableClass"
        >
          <!-- <el-table-column label="序号" type="index" width="50px" align="center"/> -->
          <el-table-column label="月" width="60">
            <template slot-scope="scope">
              <el-form-item
                label-width="0"
                :prop="'tableData.' + scope.$index + '.t0280Month'"
                :rules="[
                  {
                    validator: (rule, value, callback) => {
                      FormValidate.monthValidateValue(
                        rule,
                        value,
                        callback,
                        ruleForm.t0279Year
                      );
                    },
                    trigger: 'blur',
                  },
                ]"
              >
                <el-input v-model="scope.row.t0280Month" maxlength="10" @keyup.native="keyArrow($event, scope.$index, 0)" :ref="'arrow'+scope.$index+'_0'"/>
              </el-form-item>
            </template>
          </el-table-column>
          <el-table-column label="日" width="60">
            <template slot-scope="scope">
              <el-form-item
                label-width="0"
                :prop="'tableData.' + scope.$index + '.t0280Day'"
                :rules="[
                  {
                    validator: (rule, value, callback) => {
                      FormValidate.dayValidateValue(
                        rule,
                        value,
                        callback,
                        ruleForm.t0279Year,
                        scope.row.t0280Month
                      );
                    },
                    trigger: 'blur',
                  },
                ]"
              >
                <el-input v-model="scope.row.t0280Day" maxlength="10" @keyup.native="keyArrow($event, scope.$index, 1)" :ref="'arrow'+scope.$index+'_1'"/>
              </el-form-item>
            </template>
          </el-table-column>
          <el-table-column label="时" width="60">
            <template slot-scope="scope">
              <el-form-item
                label-width="0"
                :prop="'tableData.' + scope.$index + '.t0280Hour'"
                :rules="[
                  {
                    validator: (rule, value, callback) => {
                      FormValidate.hourValidateValue(rule, value, callback);
                    },
                    trigger: 'blur',
                  },
                ]"
              >
                <el-input v-model="scope.row.t0280Hour" maxlength="10" @keyup.native="keyArrow($event, scope.$index, 2)" :ref="'arrow'+scope.$index+'_2'"/>
              </el-form-item>
            </template>
          </el-table-column>
          <el-table-column label="分" width="60">
            <template slot-scope="scope">
              <el-form-item
                label-width="0"
                :prop="'tableData.' + scope.$index + '.t0280Minute'"
                :rules="[
                  {
                    validator: (rule, value, callback) => {
                      FormValidate.minuteValidateValue(rule, value, callback);
                    },
                    trigger: 'blur',
                  },
                  { trigger: 'blur' },
                ]"
              >
                <el-input v-model="scope.row.t0280Minute" maxlength="10" @keyup.native="keyArrow($event, scope.$index, 3)" :ref="'arrow'+scope.$index+'_3'"/>
              </el-form-item>
            </template>
          </el-table-column>
          <el-table-column label="水尺编号" width="160">
            <template slot-scope="scope">
              <el-form-item
                label-width="0"
                :prop="'tableData.' + scope.$index + '.t0280Bh'"
                :rules="{
                  min: 0,
                  max: 10,
                  message: '长度不能大于10个字符',
                  trigger: 'blur',
                }"
              >
                <el-input v-model="scope.row.t0280Bh" maxlength="10" @keyup.native="keyArrow($event, scope.$index, 4)" :ref="'arrow'+scope.$index+'_4'"/>
              </el-form-item>
            </template>
          </el-table-column>
          <el-table-column label="水尺读数（米）" width="160">
            <template slot-scope="scope">
               <el-form-item label-width="0" :prop="'tableData.'+ scope.$index +'.t0280Dushu'" :rules="[{ pattern: /^\d+$|^\d*\.\d+$/g, message: '必须为数字'},{ pattern: /^[\\+\\-]?\d+(\.\d{1,2})?$/, message:'最多小数两位'},{ pattern: /^[0-9]{1,3}(\.[0-9]{1,2})?$/, message:'不能大于1000'}]">
                <el-input v-model="scope.row.t0280Dushu" maxlength="10" @keyup.native="keyArrow($event, scope.$index, 5)" :ref="'arrow'+scope.$index+'_5'"/>
              </el-form-item>
            </template>
          </el-table-column>
          <el-table-column label="水位（米）" width="160">
            <template slot-scope="scope">
              <el-form-item label-width="0" :prop="'tableData.'+ scope.$index +'.t0280Shuiwei'" :rules='[{validator: (rule,value,callback)=>{FormValidate.validateValue(rule,value,callback)}, trigger: "blur"},{ pattern: /(^\u6CB3\u5E72$)|(^\u8FDE\u5E95\u51BB$)|(^[\\+\\-]?\d+(\.\d{1,2})?$)|^\"$/, message: "格式有误"}]'>
                <el-input v-model="scope.row.t0280Shuiwei" maxlength="10" @keyup.native="keyArrow($event, scope.$index, 6)" :ref="'arrow'+scope.$index+'_6'"/>
              </el-form-item>
            </template>
          </el-table-column>
          <el-table-column label="取样桶号" width="160">
            <template slot-scope="scope">
              <el-form-item
                label-width="0"
                :prop="'tableData.' + scope.$index + '.t0280Tonghao'"
              >
                <el-input v-model="scope.row.t0280Tonghao" maxlength="10" @keyup.native="keyArrow($event, scope.$index, 7)" :ref="'arrow'+scope.$index+'_7'"/>
              </el-form-item>
            </template>
          </el-table-column>
          <el-table-column label="备注" width="160">
            <template slot-scope="scope">
              <el-form-item
                label-width="0"
                :prop="'tableData.' + scope.$index + '.t0280Remark'"
                :rules="{
                  min: 0,
                  max: 20,
                  message: '长度不能大于20个字符',
                  trigger: 'blur',
                }"
              >
                <el-input v-model="scope.row.t0280Remark" maxlength="20" @keyup.native="keyArrow($event, scope.$index, 8)"  :ref="'arrow'+scope.$index+'_8'"/>
              </el-form-item>
            </template>
          </el-table-column>
          <el-table-column
            property="address"
            label="操作"
            width="100px"
            align="center"
          >
            <template slot-scope="scope">
              <el-button
                size="mini"
                type="text"
                @click="handleUpdate(scope.$index, scope.row)"
                >添加</el-button
              >
              <el-button
                size="mini"
                v-if="ruleForm.tableData.length > 1"
                type="text"
                @click="handleDelete(scope.row, scope.$index)"
              >
                删除
              </el-button>
            </template>
          </el-table-column>
          <el-table-column
            property="address"
            label="调整顺序"
            width="100px"
            align="center"
          >
            <template slot-scope="scope">
              <el-button
                v-if="scope.$index != 0"
                @click="upward(scope.$index)"
                size="mini"
                >↑</el-button
              >
              <el-button
                v-if="scope.$index != ruleForm.tableData.length - 1"
                @click="downward(scope.$index)"
                size="mini"
                >↓</el-button
              >
            </template>
          </el-table-column> </el-table
        ><br />

必须有:ref

//键盘方向键事件
        keyArrow(e,rowIndex,columnIndex){
 // 定义一个内部函数getinputAttrKey，接收两个参数：行索引rIndex和列索引cIndex  
            function getinputAttrKey(rIndex,cIndex){
// 返回格式为'arrow[rowIndex]_[columnIndex]'的字符串  
                return 'arrow'+rIndex+'_'+cIndex;
            }
            console.log("keyArrow",e.keyCode);
            //当前开始触发的输入框
            let nowInputRefAttr = getinputAttrKey(rowIndex,columnIndex)
            let tableLen = this.ruleForm.tableData.length;
            if (tableLen == 0) return
            
            // 上键
            if (e.keyCode == 38) { 
                console.log("上键");
                if(rowIndex == 0){
                    console.log("第一行不能往上了");
                    return;
                }
                this.$refs[nowInputRefAttr].blur();
                let inputRefAttr = getinputAttrKey(rowIndex-1,columnIndex)
                console.log("inputRefAttr",inputRefAttr);
                this.$nextTick(() => {
                    this.$refs[inputRefAttr].focus()
                })
            }

             // 下键
            if(e.keyCode == 40){
                console.log("下键");
                if(rowIndex == (tableLen - 1)){
                    console.log("最后一行不能往下了");
                    return;
                }
                this.$refs[nowInputRefAttr].blur();
                let inputRefAttr = getinputAttrKey(rowIndex+1,columnIndex)
                console.log("inputRefAttr",inputRefAttr);
                this.$nextTick(() => {
                    this.$refs[inputRefAttr].focus()
                })
            }

            // 左键
            if (e.keyCode == 37) {
                console.log("左键");
                if(columnIndex == 0){
                    console.log("第一列行不能往左了");
                    return;
                }
                this.$refs[nowInputRefAttr].blur();
                let inputRefAttr = getinputAttrKey(rowIndex,columnIndex-1)
                console.log("inputRefAttr",inputRefAttr);
                this.$nextTick(() => {
                    this.$refs[inputRefAttr].focus()
                })
            
            }

            // 右键
            if (e.keyCode == 39) { 
                console.log("右键");
                if(columnIndex == 8){
                    //最后一列input框最大值是8，就写死，不同表格列数改一下，从0开始
                    console.log("最后一列行不能往右了");
                    return;
                }
                this.$refs[nowInputRefAttr].blur();
                let inputRefAttr = getinputAttrKey(rowIndex,columnIndex+1)
                console.log("inputRefAttr",inputRefAttr);
                this.$nextTick(() => {
                    this.$refs[inputRefAttr].focus()
                })
            }

        },

//各种验证
import { dataEnum } from "./dataEnum";

let FormValidate = {}
// 手机号码
FormValidate.MobilePhone = /^1[0-9]{10}$/
FormValidate.MobilePhoneMsg = '请输入正确的手机号码';

// 座机号码
FormValidate.Landline = /^(\d{3,4}-)?\d{7,8}(-\d{3,4})?$/
FormValidate.LandlineMsg = '请输入正确的座机号码';

// 手机和座机
FormValidate.GeneralNumber = /(^(\d{3,4}-)?\d{7,8}(-\d{3,4})?$)|(^1[0-9]{10}$)/
FormValidate.GeneralNumberMsg = '请输入正确的手机或座机号码';

// 必填验证
FormValidate.validateValue = function(rule, value, callback,year) {
    // console.log("vvv",rule);
    if(value+"" == 'null' || value+"" == 'NULL'){
        value = "";
    }
    //console.log("vvv2",value+"");
    if ((value+"").replace(/^\s+|\s+$/g,"").length < 1){
        callback(new Error("必填"));
    }
    return callback();
}

// 年份自定义验证
FormValidate.yearValidateValue = function(rule, value, callback,row) {
    if ((value+"").replace(/^\s+|\s+$/g,"").length < 1){
        callback(new Error("必填"));
    }
    // let t0008Year = row.t0008Year;
    // let now = new Date();
    // let year = now.getFullYear(); // 得到年份
    // if (t0008Year > year || t0008Year < 1950){
    //     callback(new Error("无效年份"));
    // }
    return callback();

}

// 月份验证
FormValidate.monthValidateValue = function(rule, value, callback,year) {
        if (!year) {
            return callback(new Error("年份有误"))
        }
        if ((value+"").replace(/^\s+|\s+$/g,"").length < 1){
            callback(new Error("必填"));
        }
        if (!/^(0?[1-9]|1[0-2])$/g.test(value)){
            callback(new Error("月份不存在"));
        }
        return callback();

}
// 日自定义验证
FormValidate.dayValidateValue = function(rule, value, callback,year,month,required = true) {
    //console.log(rule, value, callback,year,month,"dayValidateValue");
    if (!year) {
        callback(new Error("年份有误"))
    }
    if(value+"" == 'null' || value+"" == 'NULL'){
        value = "";
    }
    if ((value+"").replace(/^\s+|\s+$/g,"").length < 1){
        if(required){
           return callback(new Error("必填"));
        }
        return callback();
    }
    let m = parseInt(month)
    let y = parseInt(year)
    let thisMonthDate = new Date(y, m, 0);
    let thisDays = thisMonthDate.getDate();
    if (value < 1 || value > thisDays) {
        callback(new Error("日不存在"));
    }
    callback();

}
// 小时自定义验证(0-23)
FormValidate.hourValidateValue = function(rule, value, callback) {
    if ((value+"").replace(/^\s+|\s+$/g,"").length < 1){
        callback(new Error("必填"));
    }
    if (!/^(2[0-3]|[0-1]?\d)$/g.test(value)){
        callback(new Error("时间不存在"));
    }
    return callback();
}
    <el-table-column label="读数（米）">
                            <template slot-scope="scope">
                                <el-form-item label-width="0" :prop="'tableData.'+ scope.$index +'.t0008DuShu'" :rules="[{ pattern: /^\d+$|^\d*\.\d+$/g, message: '必须为数字'},{ pattern: /^[\\+\\-]?\d+(\.\d{1,2})?$/, message:'最多小数两位'},{ pattern: /^[0-9]{1,3}(\.[0-9]{1,2})?$/, message:'不能大于1000'}]">
                                    <el-input v-model="scope.row.t0008DuShu" :ref="'arrow'+scope.$index+'_5'" @keyup.native="keyArrow($event, scope.$index, 5)"/>
                                </el-form-item>
                            </template>
                        </el-table-column>

在页面自定义验证

 <el-table-column align="center" label="降水时间">
                      <el-table-column align="center" label="起">
                        <el-table-column align="center" label="日" width="50">
                          <template v-slot="params">
                            <el-form-item label-width="0" :prop="'tableData.'+ params.$index +'.t0100QDay'" :rules="[{validator:(rule,value,callback)=>{FormValidate.dayValidateValue(rule,value,callback,ruleForm.Year,params.row.t0100GMonth)}, trigger: 'blur'}]">
                              <el-input :readonly="!isTableOperation" v-model="params.row.t0100QDay"/>
                            </el-form-item>
                          </template>
                        </el-table-column>
                        <el-table-column align="center" label="时" width="50">
                          <template v-slot="params">
                            <el-form-item label-width="0" :prop="'tableData.'+ params.$index +'.t0100QHour'" :rules="[{validator: (rule,value,callback)=>{FormValidate.hourValidateValue(rule,value,callback)}, trigger: 'blur'}]">
                              <el-input :readonly="!isTableOperation" v-model="params.row.t0100QHour"/>
                            </el-form-item>
                          </template>
                        </el-table-column>
                        <el-table-column align="center" label="分" width="50">
                          <template v-slot="params">
                            <el-form-item label-width="0" :prop="'tableData.'+ params.$index +'.t0100QMinute'" :rules="[{validator: (rule,value,callback)=>{FormValidate.minuteValidateValue(rule,value,callback)}, trigger: 'blur'}]">
                              <el-input :readonly="!isTableOperation" v-model="params.row.t0100QMinute"/>
                            </el-form-item>
                          </template>
                        </el-table-column>
                      </el-table-column>
                      <el-table-column align="center" label="迄">
                        <el-table-column align="center" label="日" width="50">
                          <template v-slot="params">
                            <el-form-item label-width="0" :prop="'tableData.'+ params.$index +'.t0100ZDay'" :rules="[{validator:(rule,value,callback)=>{FormValidate.dayValidateValue(rule,value,callback,ruleForm.Year,params.row.t0100GMonth)}, trigger: 'blur'}]">
                              <el-input :readonly="!isTableOperation" v-model="params.row.t0100ZDay"/>
                            </el-form-item>
                          </template>
                        </el-table-column>
                        <el-table-column align="center" label="时" width="50">
                          <template v-slot="params">
                            <el-form-item label-width="0" :prop="'tableData.'+ params.$index +'.t0100ZHour'" :rules="[{validator: (rule,value,callback)=>{FormValidate.hourValidateValue(rule,value,callback)}, trigger: 'blur'}]">
                              <el-input :readonly="!isTableOperation" v-model="params.row.t0100ZHour"/>
                            </el-form-item>
                          </template>
                        </el-table-column>
                        <el-table-column align="center" label="分" width="50">
                          <template v-slot="params">
                            <el-form-item label-width="0" :prop="'tableData.'+ params.$index +'.t0100ZMinute'" :rules="[{validator: (rule,value,callback)=>{FormValidate.minuteValidateValue(rule,value,callback)}, trigger: 'blur'},{validator: (rule,value,callback)=>{minuteValidateValue1(rule,value,callback,params.row)}, trigger: 'blur'}]" >
                              <el-input :readonly="!isTableOperation" v-model="params.row.t0100ZMinute" @blur="handleBlur(params.row)"/>
                            </el-form-item>
                          </template>
                        </el-table-column>


methods: {
//验证
    minuteValidateValue1(rule,value,callback,row){
      console.log(row);
      if (!row.t0100GMonth) {
          return callback(new Error("月份有误"))
      }
      if (!row.t0100QDay) {
          return callback(new Error("起日有误"))
      }
      if (!row.t0100ZDay) {
          return callback(new Error("讫日有误"))
      }
      if (!row.t0100QHour) {
          return callback(new Error("起时有误"))
      }
      if (!row.t0100ZHour) {
          return callback(new Error("讫时有误"))
      }
      if (!row.t0100QMinute) {
          return callback(new Error("起分有误"))
      }
      if (!row.t0100ZMinute) {
          return callback(new Error("讫分有误"))
      }
    }
//计算时间
handleBlur(row){
        let t0100GMonth = ''
        let t0100QDay = ''
        let t0100QHour = ''
        let t0100QMinute = ''
        let t0100ZDay = ''
        let t0100ZHour = ''
        let t0100ZMinute = ''
        if(row.t0100GMonth.length == 1){
          t0100GMonth = '0'+row.t0100GMonth
        }else{
          t0100GMonth = row.t0100GMonth
        }
        if(row.t0100QDay.length == 1){
          t0100QDay = '0'+row.t0100QDay
        }else{
          t0100QDay = row.t0100QDay
        }
        if(row.t0100ZDay.length == 1){
          t0100ZDay = '0'+row.t0100ZDay
        }else{
          t0100ZDay = row.t0100ZDay
        }
        if(row.t0100QHour.length == 1){
          t0100QHour = '0'+row.t0100QHour
        }else{
          t0100QHour = row.t0100QHour
        }
        if(row.t0100ZHour.length == 1){
          t0100ZHour = '0'+row.t0100ZHour
        }else{
          t0100ZHour = row.t0100ZHour
        }
        if(row.t0100QMinute.length == 1){
          t0100QMinute = '0'+row.t0100QMinute
        }else{
          t0100QMinute = row.t0100QMinute
        }
        if(row.t0100ZMinute.length == 1){
          t0100ZMinute = '0'+row.t0100ZMinute
        }else{
          t0100ZMinute = row.t0100ZMinute
        }
        const date1 = new Date(this.ruleForm.Year+'-'+t0100GMonth+'-'+t0100QDay+'T'+t0100QHour+':'+t0100QMinute+':00');
        const date2 = new Date(this.ruleForm.Year+'-'+t0100GMonth+'-'+t0100ZDay+'T'+t0100ZHour+':'+t0100ZMinute+':00');
        // 计算两个日期时间之间的毫秒差
        console.log(date2);
        const differenceMs = date2 - date1;
        console.log(differenceMs,'differenceMs');
        // 将毫秒差转换为小时和分钟
        row.t0100LiHour = Math.floor((differenceMs % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
        row.t0100LiMinute = Math.floor((differenceMs % (1000 * 60 * 60)) / (1000 * 60));

    },
}

oxygen-1204
关注
  • 10
    点赞
  • 踩
  • 9
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
鼠标事件、表单事件、键盘事件、焦点事件
m0_48860371的博客
08-30 2307
事件
android 支持键盘导航
chuyouyinghe的专栏
08-13 1009
编写:zhaochunqi - 原文:http://developer.android.com/training/keyboard-input/navigation.html 除了软键盘输入法（如虚拟键盘）以外，Android支持将物理键盘连接到设备上。键盘不仅方便输入文本，而且提供一种方法来导航和与应用交互。尽管多数的手持设备（如手机）使用触摸作为主要的交互方式，但是随着平板和一些类似的设
w ndows键盘哪个键,B.O.W航世的蓝牙键盘的BackSpace键失灵怎么办？Windows修改键盘映射帮到你。...
weixin_35931314的博客
05-23 1288
B.O.W航世的蓝牙键盘的BackSpace键失灵怎么办？这就是我痛苦的根源啊，昨天一天的好心情都没有了。狗东买的航世，昨天刚好过保3天。然后就有了以下的这篇操作。不给修，只能改键了。 来源1：Windows修改键盘映射来源2：问题：笔记本电脑的键盘布局如下，经常使用Home和End的我很不习惯没有End键，于是打算通过修改不常用的按钮解决：方法一：通过Sharpkeys软件修改1.下载Shar...
html模拟点击某个键盘按钮,如何使用JavaScript模拟按键或单击？
weixin_30071787的博客
06-05 1963
模拟鼠标单击我的猜测是网页正在监听mousedown而不是点击(这对于可访问性是不利的，因为当用户使用键盘时，只会触发焦点和点击，而不是mousedown)。所以你应该模拟mousedown，click和mouseup(顺便说一句，它是iPhone，iPod Touch和iPad在点击事件上做的事情)。要模拟鼠标事件，可以将此代码段用于支持DOM 2 Events的浏览器。要获得更加简单的模拟，请...
工具分享：在线键盘测试工具
无极低码
02-20 7324
在数字化时代，键盘作为我们与计算机交互的重要媒介之一，其性能和稳定性直接影响到我们的工作效率和使用体验。为了确保键盘的每个按键都能正常工作，并帮助用户检测潜在的延迟、连点等问题，一款优质的在线键盘测试工具显得尤为重要。本文将详细介绍一款备受推崇的在线键盘测试工具——[网址]（
迪文屏开发保姆级教程2——页面键盘
一无所知
12-19 1932
本篇文章主要介绍了在DGBUS平台上使用页面键盘的步骤。选中键盘素材所在的页面添加基本触控控件。如下图，设置一下键值，参考DGUS界面上的要求设置。重复完成所有按键的设置。老规矩，养成好习惯，三连走一波，保存、生成、导出。​​​​然后就大功告成了~~ 用SD卡拷贝 DWIN_SET文件夹到SD卡根目录，去烧写屏幕程序验证。GOOD LUCK~还是老规矩，文末来个福利图养养眼，放松一下 ~~
python通过pyautogui库来控制鼠标和键盘
SimonLiu的博客
05-09 2769
python通过pyautogui库来控制鼠标
键盘事件是指用户在使用键盘时触发的事件,这些事件可以包括keydown、keypress和keyup
BLOG域名:programb.blog.csdn.net
07-25 1104
VK_SLASH /键 VK_BACK_SLASH \键 VK_0~VK_9 0~9 键 VK_A~VK_Z a~z 键 VK_OPEN_BRACKET [键 VK_CLOSE_BRACKET ]键。VK_KP_UP 小键盘的向上箭头键 VK_KP_DOWN 小键盘的向下箭头键 VK_KP_LEFT 小键盘的向左箭头键 VK_KP_RIGHT 小键盘的向右箭头键 VK_END END 键。在这个例子中，当用户在输入框中按下键盘上的任意键时，会触发keydown事件，打印按下的键的名称。
vue中常用的鼠标事件、键盘事件、表单事件
weixin_46995731的博客
11-27 1933
vue中常用的鼠标事件鼠标事件、键盘事件、表单事件 咱们在写vue项目的时候,经常会用v-on或@进行事件绑定,总结一下绑定事件种类, 鼠标事件 Event Name Fired When auxclick A pointing device button (ANY non-primary button) has been pressed and released on an element. click 在元素上按下并释放任意鼠标按键。 contextmenu 右键点击（在右键菜单
Windows Forms 键盘事件
fan_ken的专栏
07-13 1019
一个获有焦点的控件，当按下任一键的时候就会触发键盘事件。如果需要对特殊字符，比如说方向键（arrow keys）的键盘事件做出响应，通常需要使用KeyDown或者KeyUp 事件，而KeyPress事件并不会触发。当你需要限制用户输入并完成字符验证的时候通常使用KeyPress事
浅谈js键盘事件全面控制
11-29
【标题】：深入理解...理解和掌握JavaScript的键盘事件以及浏览器兼容性处理是创建响应用户输入功能的关键。通过合理地编写和优化代码，我们可以创建出具有良好用户体验的Web应用，无论用户使用的是哪种浏览器。
jquery keypress,keyup,onpropertychange键盘事件
12-08
在JavaScript和jQuery中，处理键盘事件是常见的需求，特别是在用户输入时进行实时验证或操作。在给定的标题和描述中，提到了`keypress`、`keyup`以及`onpropertychange`这三种键盘事件，接下来将详细介绍它们以及...
JavaScript使用键盘输入控制实现数字验证功能
10-21
同时，允许用户使用Tab键进行焦点切换，Backspace键删除字符，以及使用方向键进行光标移动。 然而，对于更复杂的场景，如限制输入的位数、格式化输入（例如信用卡号的空格分隔），还需要额外的处理。例如，你可以...
易语言键盘代码大全
04-16
这包括了字母键（如A到Z）、数字键（1到0，包括数字键盘上的数字）、功能键（F1到F15）、控制键（如Shift、Ctrl、Alt）、导航键（如方向键、Page Up、Page Down等）以及特殊键（如Esc、Enter、Space等）。...
自定义安全键盘
08-16
每个键盘按钮需要响应用户的点击事件，这涉及到`UIButton`的事件监听，以及将用户输入传递给关联的文本字段。 7. **Auto Layout与Size Classes**： 自定义键盘需要适应不同屏幕尺寸和设备方向，因此开发者需熟悉...
键盘是如何使用中断机制的？当打印一串字符到显示屏上时发生了什么？？？
最新发布
weixin_62518305的博客
07-23 273
当打印完后需要响应一次中断，之后CPU还需要将内存的打印字符再送到打印机的寄存器中，会极大浪费cpu的开销。此时加入一个DMA机制来缓解CPU的的开销，将数据移动的任务交给DMA，只需要在所有打印任务完成之后触发一次中断，最后恢复应用程序1的后续操作即可。
LDR6020：重塑iPad一体式有线键盘体验的创新力量
Legendary_008的博客
07-19 581
LDR6020，作为一款功能强大的USB PD3.1协议通信芯片，不仅支持USB PD2.0、PD3.0协议，还集成了最新的PD3.1功能。这款芯片内置了高精度的USB-C接口，支持高速数据传输和PD快速充电，为iPad键盘提供了强大的技术支持。通过LDR6020，iPad键盘不仅实现了与iPad的无缝连接，还为用户带来了更加高效、便捷的充电和数据传输体验。高效充电，续航无忧得益于LDR6020芯片的PD快充功能，这款iPad键盘支持通过iPad的Type-C接口进行充电。
Java语言程序设计基础篇_编程练习题**15.18(使用鼠标来移动一个矩形)
2301_78998594的博客
07-23 146
请编写一个程序显示一个矩形。可以使用鼠标单击矩形内部并且拖动（即按住鼠标移动）矩形到鼠标的位置。鼠标点成为矩形的中央
Unigine心得之村长的野望1 - 键盘鼠标控制物体移动
ms44的专栏
07-18 820
前几日写了一个小DEMO用到键盘用ASDW等按键控制一个物体的上下左右移动和旋转等操作。2：我的代码操作的是mSelectedNode,这个节点对象请自行准备。但相信可以作用在几乎所有的Unigine版本中。因为都是基础操作函数。//用aswd控制上下左右的位置变化，参考游戏控制。这个是一个非常基础的简单控制，但是查询官方文档也是很吃力。因此，分享在此处，方便大家不用闭门造车，重复造车。//用wr控制左侧旋转和右侧。//有当前对象才操作。1：移动旋转速度，自行控制。//设置旋转和移动的速度。
"微机原理与接口技术-键盘LED显示-课程设计完整资料，包含实用资料和课程报告
展望部分提出了改进方案和进一步的研究方向，展望了键盘LED显示技术在未来的应用前景。 通过对《微机原理与接口技术-键盘LED显示-课程设计》这份完整版实用资料的学习和掌握，我们可以深入了解微机原理与接口技术的...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值