3

みんなとギャル私は数字と小数点以下1桁しか許可しないこのJavaScriptコードを持っています。私が抱えている問題は、テキストボックスコントロールにタブで移動すると値が強調表示されますが、バックスペースを押して消去してから数値を入力する必要があることです。それは私が防ぎたい余分なキーストロークです。

それを作成した人への小道具が見つかり（http://www.coderanch.com/t/114528/HTML-CSS-JavaScript/decimal-point-restriction）、ここにコードがあります。これをkeyUpイベントに入れました。

 <script>
  // Retrieve last key pressed.  Works in IE and Netscape.
  // Returns the numeric key code for the key pressed.
  function getKey(e)
  {
    if (window.event)
       return window.event.keyCode;
    else if (e)
       return e.which;
    else
       return null;
  }
  function restrictChars(e, obj)
  {
    var CHAR_AFTER_DP = 2;  // number of decimal places
    var validList = "0123456789.";  // allowed characters in field
    var key, keyChar;
    key = getKey(e);
    if (key == null) return true;
    // control keys
    // null, backspace, tab, carriage return, escape
    if ( key==0 || key==8 || key==9 || key==13 || key==27 )
       return true;
    // get character
    keyChar = String.fromCharCode(key);
    // check valid characters
    if (validList.indexOf(keyChar) != -1)
    {
      // check for existing decimal point
      var dp = 0;
      if( (dp = obj.value.indexOf( ".")) > -1)
      {
        if( keyChar == ".")
          return false;  // only one allowed
        else
        {
          // room for more after decimal point?
          if( obj.value.length - dp <= CHAR_AFTER_DP)
            return true;
        }
      }
      else return true;
    }
    // not a valid character
    return false;
  }
</script>
4

7 に答える 7

7 
<input type="text" class="decimal" value="" />

そして、Jsではこれを使用します

$('.decimal').keyup(function(){
    var val = $(this).val();
    if(isNaN(val)){
         val = val.replace(/[^0-9\.]/g,'');
         if(val.split('.').length>2) 
             val =val.replace(/\.+$/,"");
    }
    $(this).val(val); 
});

このフィドルを確認してください：http：//jsfiddle.net/2YW8g/

これは私のために働きました、私は「Nickalchemist」からこの答えを取りました、そしてその信用を何も取りません。

于 2014-01-27T14:42:55.330 に答える
5

すでに安定していてよく知られているライブラリを使用できない場合は、次のような方法を試すことができます。

document.write('<input id="inputField" onkeyup="run(this)" />');

function run(field) {
    setTimeout(function() {
        var regex = /\d*\.?\d?/g;
        field.value = regex.exec(field.value);
    }, 0);
}

間違った文字が表示されるのを防ぐことはできませんが、機能します。

PS：これsetTimeout(..., 0)は、フィールドの値がすでに変更された後に関数を実行するためのトリックです。

于 2013-01-30T17:35:44.387 に答える
3

これは、小数点以下1桁の数値のみを受け入れるサンプルソリューションです。例：1.12、11.5

Enter a number with one(1) decimal point only<br />
<input type="text" id="decimalPt"> <br />

$('.decimalPt').keypress(function(evt) {
  evt = (evt) ? evt : window.event;
  var charCode = (evt.which) ? evt.which : evt.keyCode;
  if (charCode == 8 || charCode == 37) {
    return true;
  } else if (charCode == 46 && $(this).val().indexOf('.') != -1) {
    return false;
  } else if (charCode > 31 && charCode != 46 && (charCode < 48 || charCode > 57)) {
    return false;
  }
  return true;
});

これを見てください：https ：//jsfiddle.net/sudogem/h43r6g7v/12/

于 2016-09-21T15:19:40.910 に答える
1

jQueryでマスクされた入力プラグインのように、すでに存在するものを使用するのが最善だと思います

于 2013-01-30T17:04:26.260 に答える
0

これを試して、

$('input').on('keydown', function (event) {
    return isNumber(event, this);
});
function isNumber(evt, element) {
    var charCode = (evt.which) ? evt.which : evt.keyCode;
    if ((charCode != 190 || $(element).val().indexOf('.') != -1)  // “.” CHECK DOT, AND ONLY ONE.
            && (charCode != 110 || $(element).val().indexOf('.') != -1)  // “.” CHECK DOT, AND ONLY ONE.
            && ((charCode < 48 && charCode != 8)
                    || (charCode > 57 && charCode < 96)
                    || charCode > 105))
        return false;
    return true;
}
于 2015-10-14T10:35:22.850 に答える
0

必ずどのブラウザでもテストしてください。受け入れられた答えはFirefoxでは機能しません。

HTML5タイプ番号を試してください：

<input type="number" placeholder="1.0" step="0.1">

あなたは定義することができます min="0" max="10"

参照： https ：//developer.mozilla.org/en-US/docs/Web/HTML/Element/input/number#Controlling_input_size

注： type = "number"は、InternetExplorer9以前のバージョンではサポートされていません。

于 2018-08-21T17:09:23.533 に答える
0

私はこのように私の問題を解決します。

const sanitize = (value = '') => value.replace(/(-(?!\d))|[^0-9|-]/g, '') || ''

export const toNumeric = value => {
  let digits = sanitize(value)

  // parseInt with 0 fix/avoid NaN
  digits = parseInt(0 + digits)
  let newValue = digits.toString().padStart(4, 0)

  return newValue
}
于 2021-02-05T05:51:31.680 に答える