jQuery UI-数字をヘックスとして入力するためのプラグイン?
-
19-09-2019 - |
質問
最近のプロジェクトでは、HTMLフォームの入力フィールドの1つとして、ヘックスマスク(0x0-0xff)が必要です。通常の入力を使用してヘックス値を取得できることを知っています。その後、他のフォーム送信検証と一緒に検証できます。
ただし、私が使用している他の小数点フィールドのいくつかについては ui.spinner.js(github) ユーザーがアップ/ダウンボタンを押して、数字の値を切り替えることができるようにします。ヘックス値を入力するための同様の制御があるといいでしょう。または、少なくとも、単純な入力要素よりも少し「より豊か」のコントロール。
そのようなプラグインが存在するかどうかは誰もが知っていますか?
前もって感謝します。
アップデート
私が使用しているスピナーコントロールについて言及することを怠った。混乱をお詫びします。
解決 4
カスタムを書くことでこれを解決することになりました format
と parse
ハンドラー、およびキープレスイベントをオーバーライドして、ユーザーが16進数字を入力するように刻みます。
// Functions for dealing with hex values in spinners
var parseHex = function(val) {
var options = this;
if (options.group == '.')
val = val.replace('.', '');
if (options.point != '.')
val = val.replace(options.point, '.');
return parseFloat(parseInt(val, 16));
},
formatHex = function(num, places) {
var options = this,
regex = /(\d+)(\d{3})/,
result = ((isNaN(num) ? 0 : Math.abs(num)).toFixed(places)) + '';
for (result = result.replace('.', options.point); regex.test(result) && options.group; result=result.replace(regex, '$1'+options.group+'$2')) {};
return (num < 0 ? '-' : '') + options.prefix + parseInt(result).toString(16) + options.suffix;
},
keypressHex = function(e) {
var ch = String.fromCharCode(e.charCode || e.keyCode)
if (((ch >= '0') && (ch <= '9')) || ((ch >= 'a') && (ch <= 'f')))
return true;
return false;
};
jQuery('#myinput')
.spinner({
min: 0,
max: 255,
prefix: '0x',
format: formatHex,
parse: parseHex});
jQuery('#myinput').unbind('keypress.uispinner'); // Explicitly remove the controls keypress validation
jQuery('#myinput').bind('keypress.uispinner', keypressHex);
他のヒント
私はそれを見たことがありません。スピナーにヘックスを作るのはそれほど難しくないはずです - 0x00-0xffの選択ボックスを値として作成するか、0〜256から通常のスピナーを実行し、Spin()イベントでHexに変換します。
私 考える おそらく、これを行うためにJQuery UIスピナーを使用することもできます。何もテストしていませんが、2つの可能なオプションを見ていきます。
Liのリストを使用して、JavaScriptを介してULを作成します。次に、使用します
$("#your_ul_id").spinner();
適切なヘックスに変換して、スピンイベントハンドラーを使用して出力を変更してみてください。
私は最近同じ要件を持っていました、そして、私はそれを解決するために次のプラグインを書きました: https://github.com/bubasti/jquery-hex-input
jQueryウィジェット工場を使用しており、jQuery 1.9スピナーウィジェットを使用しています。