精华内容
下载资源
问答
  • 使用Keybd_event,wpf 开发实现的全键盘和数字键盘,键盘字体随键盘大小自适应,测试使用通过
  • 本篇文章主要介绍了Android自定义键盘的实现(数字键盘和字母键盘),具有一定的参考价值,有兴趣的可以了解一下
  • C# 数字键盘实现

    2018-11-16 21:40:20
    C# 数字键盘实现,类似微软的小键盘功能,只有数字功能区,字母功能可以下载后进行改进
  • QT编写的数字键盘

    2018-10-10 11:06:04
    使用qt编写的数字键盘,包括有数字,正负号,退出,后退,确认,删除,小数点的功能。代码比较简单且代码中有具体注释,在这就不作具体说明
  • html5 数字键盘 软键盘

    2018-08-24 10:48:48
    html5 数字键盘 软键盘 可用于制作html5版本的支付控件,金额支付等
  • 最近做 Vue 开发,因为有不少页面涉及到金额输入,产品老是觉得用原生的 input 进行金额输入的话 体验很不好,于是自己动手写了一个使用Vue自定义数字键盘组件,具体实现代码大家参考下本
  • VS2013下WPF实现数字键盘,点击界面上的输入框,能够自动弹出数字键盘,显示3x4 布局的软键盘,有半透明效果
  • C# form 数字键盘

    2018-03-10 17:00:15
    用C#编写的一款winform数字键盘#####################################################################
  • 数字键盘,移动端可用,jq+html+css,最简洁的数字键盘
  • 本demo为android studio 版本,如果你的as无法运行请手动复制进去运行吧
  • 自己做的一个软键盘,支持数字键盘和字母键盘,默认绑定的textbox,可以自己看情况进行修改.
  • 一个自定义的 android 纯数字键盘输入 demo 源码
  • 数字键盘,样式简洁,可用于支付密码使用,原生js和jq两版里面都有。
  • H5 js 模拟(微信/支付宝)数字键盘,采用input输入框实现
  • H5 JS 模拟数字键盘

    2017-07-31 12:04:26
    dome可测试,无任何插件;可自定义样式
  • 最近做了个第三方支付页,H5+JS+相对单位rem实现(输入金额+模拟数字键盘+自适应布局+大写金额),浏览器后打开请切换成移动视角。
  • Qt 数字虚拟键盘实现

    2017-03-27 15:56:32
    Qt 数字虚拟键盘实现
  • C++数字键盘源代码,通过内部稍微更改程序可以将键盘扩展到全部键盘。
  • 封装好的数字键盘控件,实现了在手机上自带的键盘弹出,显示自己编写的数字键盘
  • 不想用手机自带的数字键盘,制作一个符合自己要求的数字键盘只能输入小数点后2位,样式可根据自身的需要进行调试。
  • vue数字虚拟键盘组件

    2019-08-10 10:44:10
    A Vue component to num-keyboard 一个虚拟数字键盘插件
  • 用于练习数字键盘盲打,测试数字按键速度,你值得拥有!
  • 移动端h5点击input打开数字键盘

    千次阅读 2018-12-07 17:07:00
    1、弹出数字键盘,有以下两种方式 2、还有一种可以调用九宫格数字键盘: *"/>   [0-9]*">[0-9]*">   转载于:https://my.oschina.net/u/2365397/blog/2981097

    1、弹出数字键盘,有以下两种方式

    <input type='tel' />
    <input type='number' />

    2、还有一种可以调用九宫格数字键盘:

    <input type="number" pattern="\d*"/>
    

     

    
    <input type="number" pattern="[0-9]*"></input type="number" pattern="[0-9]*"></input type="number" pattern="\d">

     

    转载于:https://my.oschina.net/u/2365397/blog/2981097

    展开全文
  • android 自定义 悬浮数字键盘

    热门讨论 2014-08-29 09:28:12
    android 自定义的数字键盘,方便用户输入,防止不断的弹出系统自带的键盘
  • 为了提高用户信息的安全性,在用户输入密码时需要设定让用户从软键盘中输入,这是个demo包含完整的调用,可快速引入到自己的项目中。
  • 用qt5写的虚拟键盘,具有数字键盘和全键盘两个尺寸,全键盘是26键,数字键盘是9键。按切换键可以切换键盘。
  • WinCC数字输入键盘,可输入小数,正负号。 在WinCC自带的图形库中包含了一个数字键盘,但是只能输入整数,无法输入小数。 此小键盘是在自带小键盘的基础上重新编写脚本,加入小数点和正负号。主要是通过字符串转...
  • vue功能-数字键盘

    千次阅读 2019-07-04 18:09:56
    vue项目pc端中,有的触摸屏页面需要JS封装键盘,如下就是全部代码~ 1.首先是封装的键盘组件 <template> <div class="keyboard" v-show="showKeyboard" v-clickoutside="closeModal"> <p v-for=...

    vue项目pc端中,有的触摸屏页面需要JS封装键盘,如下就是全部代码~

    1.首先是封装的键盘组件

    <template>
      <div class="keyboard" v-show="showKeyboard" v-clickoutside="closeModal">
        <p v-for="keys in keyList">
          <template v-for="key in keys  ">
            <i v-if="key === 'top'" @click.stop="clickKey"  class="iconfont icon-zhiding tab-top"></i>
            <i v-else-if="key === '123'" @click.stop="clickKey"  class="tab-num">123</i>
            <i v-else-if="key === 'del'" @click.stop="clickKey"  id="del"  class="iconfont icon-delete key-delete"></i>
            <i v-else-if="key === 'blank'" @click.stop="clickKey"  class="iconfont icon-konggejian-jianpanyong tab-blank"></i>
            <i v-else-if="key === 'symbol'" @click.stop="clickKey"  class="tab-symbol">符</i>
            <i v-else-if="key === 'point'" @click.stop="clickKey"  class="tab-point">·</i>
            <i v-else-if="key === 'enter'" @click.stop="clickKey"  class="iconfont icon-huiche tab-enter"></i>
            <i v-else @click.stop="clickKey" >{{key}}</i>
          </template>
        </p>
        <p v-show="isShow"><i @click="closeKeyBoard">确定</i></p>
      </div>
    </template>
    <script>
    import clickoutside from '../../directives/clickoutside'
    export default {
      directives: { clickoutside },
      data() {
        return {
          keyList: [],
          status: 2,//0 小写 1 大写 2 数字 3 符号
          lowercase: [
            ['7', '8', '9'],
            ['4', '5', '6'],
            ['1', '2', '3'],
            ['.','0','del'],
          ],
          //equip:!!navigator.userAgent.toLocaleLowerCase().match(/ipad|mobile/i)//是否是移动设备
        }
      },
      props: {
        option: {
          type: Object
        },
        isShow:{
        	type:Boolean,
        	default :true
        }
      },
      computed: {
        showKeyboard(){
          return this.option.show
        }
      },
      mounted() {
        this.keyList = this.lowercase
      },
      methods: {
        closeKeyBoard(){
        	this.option.show=false;
        	this.$emit('submit');
        },
        tabHandle({ value = '' }) {
          if(value.indexOf('tab-num') > -1){
             this.status = 2
             //数字键盘数据
          }else if(value.indexOf('key-delete') > -1){
            console.log(value.indexOf('key-delete'))
            this.emitValue('delete')
          }else if(value.indexOf('tab-blank') > -1){
            this.emitValue(' ')
          }else if(value.indexOf('tab-enter') > -1){
            this.emitValue('\n')
          }else if(value.indexOf('tab-point') > -1){
            this.emitValue('.')
          }else if(value.indexOf('tab-symbol') > -1){
            this.status = 3
          }else if(value.indexOf('tab-top') > -1){
            if(this.status === 0){
              this.status = 1
            }else{
              this.status = 0
              this.keyList = this.lowercase
            }
          }else{
          }
        },
        clickKey(event) {
          let value = event.srcElement.innerText||'';
          let id = event.srcElement.id;
          let target = event.srcElement ? event.srcElement : event.target;
          if(id !== '' && id === 'del'){//如果点击的是id为del的表示是删除
           this.emitValue(id);
          }else{
            value && id !== 'del'? this.emitValue(value) : this.tabHandle(target.classList);
          }
        },
        emitValue(key) {
          this.$emit('keyVal', key)
        },
        closeModal(e) {
          if (e.target !== this.option.sourceDom) {
            // this.showKeyboard = false
            this.$emit('close', false)
          }
        }
      }
    }
    </script>
    <style scoped lang="less">
    .keyboard {
    	display: inline-block;
      width: 263px;
      height: 258px;
      font-size: 18px;
      border-radius: 2px;
      background-color: #fff;
      user-select: none;
      bottom: 0;
      position: absolute;/*定位数字键盘*/
      left: 0;
      top: 77px;
      z-index: 999;
      pointer-events: auto;
      p {
        width: 100%;
        margin: 0 auto;
        height: 42px;
        margin-bottom: 0.6em;
        display: flex;
        display: -webkit-box;
        flex-direction: row;
        flex-wrap: nowrap;
        justify-content: center;
        i {
          display: block;
          margin: 2px 1px;
          height: 50px;
          line-height: 52px;
          font-style: normal;
          box-sizing: border-box;
          font-size: 24px;
          border-radius: 3px;
          width: 44px;
          background-color: rgba(228, 52, 55, 0.78);
          text-align: center;
          flex-grow: 1;
          flex-shrink: 1;
          flex-basis: 0;
          -webkit-box-flex: 1;
          color:#fff;
          &:active {
            background-color: #c03030;
          }
        }
        .tab-top {
          width: 50px;
          margin: 0 1%;
          background: #cccdd0;
          color: #fff;
          font-size: 24px;
        }
        .key-delete {
          color: #fff;
        }
        .tab-num {
          font-size: 18px;
          background: #dedede;
          color: #5a5959;
        }
        .tab-point {
          width: 20px;
        }
        .tab-blank {
          width: 50px;
          font-size: 12px;
          padding: 0 15px;
          color: #5a5959;
          line-height: 60px;
        }
        .tab-symbol {
          width: 20px;
          font-size: 18px;
        }
        .tab-enter {
          font-size: 30px;
          line-height: 54px;
        }
        &:nth-child(2) {
          width: 100%;
        }
      }
    }
    </style>
    
    

    这个组件中引入了一个js文件如下:

    export default {
      bind(el, binding, vnode) {
        function documentHandler(e) {
          if (el.contains(e.target)) {
            return false;
          }
          if (binding.expression) {
            binding.value(e);
          }
        }
        el.__vueClickOutside__ = documentHandler;
        document.addEventListener('click', documentHandler);
      },
      update(el, binding, vnode) {},
      unbind(el, binding) {
        document.removeEventListener('click', el.__vueClickOutside__);
        delete el.__vueClickOutside__;
      }
    };
    
    

    2.接下来就可以在页面中引用数字键盘

    			<Keyboard
    				class="changeKBstyle"
    				:option="option"
     				@close="option.show = false"
    				@keyVal="getInputValue"
    			></Keyboard>
    	import Keyboard from '@/components/keyup/Keyboard';
    	components: {
    			Keyboard
    		},
    

    以下是对输入的数字截取(我是金额类截取最多两位小数)

     // 输入金额
    		  getInputValue(val){
    			  // moneyInput 购买金额
    				  if (val === 'del' ) {
    					  this.stepsNum.moneyInput = this.stepsNum.moneyInput.toString().substr(0, this.stepsNum.moneyInput.toString().length - 1);
    				  } else {
    					  if(this.stepsNum.moneyInput.indexOf(".") >=0){
    						  if(val ==".") return ;
    						  let start=this.stepsNum.moneyInput.indexOf("."),end=start+2;
    						  this.stepsNum.moneyInput=this.stepsNum.moneyInput.slice(0,start)+this.stepsNum.moneyInput.slice(start,end);
    					  }
    					  this.stepsNum.moneyInput += val
    				  }
    		  },
    

    以上就是全部代码,冗余代码可自行更改!

    展开全文
  • QT数字键盘,包括QLineEdit弹出

    热门讨论 2015-06-24 08:56:53
    最简单的数字键盘例子,包含QlineEdit弹出的部分,方便自己根据需要修改。比qt自带的例子inputpanel简单的多。

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 253,900
精华内容 101,560
关键字:

怎么打开键盘数字键盘