入力番号のマスク - マイナス記号を防止

Question

スペースを含む数字の入力番号マスクを、区切り記号と小数点記号として構築しようとしています。正と負の両方の数値が許されます。これまでのところ解決策。 1つの問題は、マイナス記号（入力フィールドは空または0にする）とマイナス記号の後ろだけを許可しない方法です。コードを改善するための他の提案はありますか？

function thousandany(x) { 
 
    return x 
 
    .replace(/(?!-)\D+/g, '') //ta bort alla utom nummer 
 
    .toString().replace(/\B(?=(\d{3})+(?!\d))/g, " "); 
 
} 
 

 
$(document).ready(function() { 
 
    $("input").keyup(function() { 
 
    $(this).val(thousandany($(this).val())); 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input style="text-align:right">

Answer 1

私は本当に正規表現についてあまり知らないが、あなたのUXは非常にユーザーフレンドリーかつ快適なようではありません。なぜそれがうまく動作するかどうかを確認するためにデータの検証を続行しないでください。ユーザーは、右側にのみ入力するように強制しています。 あなたが入力したテキストを変更したいのに、20の数字がある場合は、最初のものを変更するためにそれらをすべて削除する必要があります。

私が言ったように私はそれが出て焦点を当てたときに、ユーザーが（それは迷惑になることはない）データを入力して終了し、または例えばた後にコードに検証を実行するために、別のアプローチとして、推薦します入力のユーザは、馬鹿ではありません。例えば正の数、例えば整数を入力する必要があることを一度伝えれば、それに従って入力を変更します。彼または彼女の入力を騙し続けることは実際には迷惑になることがあります。特にあなたがすでに書いたテキストを変更できない場合は特にそうです。

整数であるかどうか、正であるかどうかなど、有効な数字かどうかを確認することができます。このように入力を強制するよりもはるかに意味があり、コードはるかに複雑な - 私の意見では、それは不要です。

また、文字を使用する科学的表記法（考慮する可能性があります）のような他の側面があり、それらをまったく実装したい場合はさらに複雑な正規表現が必要であることを忘れないでください。

もちろん、これはあなたの質問に直接答えるものではありませんが、あなたが作っている努力が完全に必要な場合や、より効率的な方法で対応できるかどうか再考するかもしれません。

ユーザーが出て焦点を当てていたり、特定のボタンをクリックした後、あなたがそれを行うことができる方法の例は、次のようになります。もちろん

$(document).ready(startCheck) 

function startCheck() { 

    $("#myInputField").focusout(checkData) 
    %("#myButton").click(checkData) 
} 

function checkData() { 
    var data = $("#myInputField").val(); 
    if $.isNumeric(data) { 
     // do something 
    } else { 
     alert("Please input a number") 
} 

あなたは、あなたの便利にそれを変更することができ、よりユーザーフレンドリーな操作を行うために入力が間違っていることを通知したり、整数だけを渡すか、正の値を渡すかなどを調整することができます。