Question

我在这里疯了......我已经投入了超过16个小时试图让这件事情起作用，如果有人对这种邪恶行为的原因有任何线索请咨询..

我在表单中有多个类型编号的输入，我将键盘连接到每个输入，如下所示：

$('.amount').keyboard({
    layout: 'custom',
    customLayout : {
      'normal' : ['1 2 3', '4 5 6', '7 8 9','{clear} 0 {bksp}','{accept}']
    },

    display : {
      'accept' : 'Confirm:Confirm (Shift-Enter)',
      'bksp' : 'Delete:Delete',
      'clear': 'Clear:Clear'
    },

    beforeVisible: function(e, keyboard, el) {
      $("#"+keyboard.$keyboard[0].id).addClass("hide-me");
    },

    restrictInput: true,
    preventPaste: true,
    autoAccept: true,
    usePreview: false,
    useWheel: false,
    repeatRate: 0,

    // this function is so I can display cents in the input
    // there is no decimal in the keyboard as part of the requirements
    change: function(e, keyboard, el) {
        if (el.value === null || el.value === "") {
            el.value = "0.00";
        }

        el.value = parseInt(el.value);
        el.value = el.value * 0.01;
    },

    // this function is so I can display cents in the inputs
    // there is no decimal in the keyboard as part of the requirements
    accepted: function(e, keyboard, el) {
        if (el.value === null || el.value === "") {
            el.value = "0.00";
        }

        el.value = parseInt(el.value);
        el.value = el.value * 0.01;
    },

    caretToEnd: 'true',
    maxLength : '20',
    css: {
      container: 'center-block dropdown-menu custom-keypad',
      buttonDefault: 'btn-kb',
      buttonHover: 'btn-primary',
      buttonAction: 'active',
      buttonDisabled: 'disabled'
    }
});

键盘会弹出，我可以在输入时正确看到输入中的小数，并确认输入。我的目标是将所有input.val（）求和，并在表单上发生任何更改时立即验证它们。这样做的功能是这样的：

    $('form').on('change', '.amount', function () {
        var balance = NUMBER;
        var sum = 0;

        $(".amount").each(function (){
            var valTotal = Number($(this).val());
            if (!isNaN(valTotal)) {
                sum += valTotal;
            }
        });

        if (sum > balance) {
           //stuff happens
        }

    });//.end of form

这是问题开始的地方，当我去输入总和时，我的小数消失了！什么是22.22现在是2222因此我的总和是错误的，导致我的总和总是大于我的余额。我试图创建一个小提琴，但它不会弹出结果框上的键盘，所以我不能给你一个现场例子..

这是我正在使用的CDN：

https://cdnjs.cloudflare.com/ajax/libs/virtual-keyboard/1.26.17/js/jquery.keyboard.extension-all.min.js

https://cdnjs.cloudflare.com/ajax/libs/virtual-keyboard/1.26.17/js/jquery.keyboard.min.js

请咨询!!

Answer 1

所以我与该插件的创建者取得了联系，他很友善地通过电子邮件回答了我的问题。他的解决方案完美无缺！

你可以在这里看到小提琴.. http://jsfiddle.net/Mottie/egb3a1sk/2506/

/* VIRTUAL KEYBOARD DEMO - https://github.com/Mottie/Keyboard */
$(function() {

  // this function is so I can display cents in the input
  // there is no decimal in the keyboard as part of the requirements
  function convert(el) {
    var value = el.value;
    if (el.value === null || el.value === "") {
      value = "0.00";
    }
    value = parseInt(value, 10);
    value = value * 0.01;
    el.value = value.toFixed(2);
  }

  NUMBER = 100;
  function sum() {
    var balance = NUMBER;
    var sum = 0;
    $(".amount:not(:disabled)").each(function() {
      var valTotal = Number($(this).val());
      if (!isNaN(valTotal)) {
        sum += valTotal;
      }
    });
    if (sum > balance) {
      //stuff happens
    }
    $('.sum').text(sum);
  }

  $('.amount').keyboard({
    layout: 'custom',
    customLayout: {
      'normal': ['1 2 3', '4 5 6', '7 8 9', '{clear} 0 {bksp}', '{accept}']
    },

    display: {
      'accept': 'Confirm:Confirm (Shift-Enter)',
      'bksp': 'Delete:Delete',
      'clear': 'Clear:Clear'
    },

    beforeVisible: function(e, keyboard, el) {
      $("#" + keyboard.$keyboard[0].id).addClass("hide-me");
    },

    restrictInput: true,
    preventPaste: true,
    autoAccept: true,
    usePreview: false,
    useWheel: false,
    repeatRate: 0,

    change: function(e, keyboard, el) {
      convert(el);
    },
    accepted: function(e, keyboard, el) {
      convert(el);
      sum();
    },

    caretToEnd: 'true',
    maxLength: '20',
    css: {
      container: 'center-block dropdown-menu custom-keypad',
      buttonDefault: 'btn-kb',
      buttonHover: 'btn-primary',
      buttonAction: 'active',
      buttonDisabled: 'disabled'
    }

  });

});

主要问题是$（'。amount'）选择器包含一个隐藏的重复输入，因此他将其更改为$（“。amount：not（：disabled）”）并且他在“接受”

上格式化后立即执行了sum（）操作

完美地工作=）

如何用mottie键盘输入美分并将它们保存在那里？

1 个答案: