Paparkan html-Input-value sebagai nombor dalam format Jerman apabila input berubah semasa menjejaki nombor perpuluhan
Jadi nombor perpuluhan Jerman menggunakan koma perpuluhan. Semasa memformat, kami juga menggunakan noktah untuk mengumpulkan nombor. Jadi nombor 10000.45 akan diformatkan sebagai 10.000,45.
Sekarang saya mahukan medan input (nombor atau teks) di mana anda boleh memasukkan cara "Jerman" menggunakan noktah dan koma. Walau bagaimanapun, saya juga ingin menjejaki nilai "normal" dalam JavaScript.
Gunakan arahan berikut untuk menukar nilai angka kepada nilai dalam format Jerman dengan mudah
number.toLocaleString("de-DE", { maxFractionDigits: 2 })
Tetapi bagaimana untuk mengembalikannya kepada nombor perpuluhan? Kerana apabila saya memaparkan nilai dalam format Jerman seperti "7,20" saya tambahkan pada penghujung, bukan?
Ini adalah percubaan awal untuk svelte-repl, seperti yang ditunjukkan di bawah: https://svelte.dev/repl/fabd0a80f4ee49509cd875c0175bcf22?version=4.0.1
<script>
let numericValue = 0;
let formattedValue = '';
function formatNumber(value) {
return value.toLocaleString("de", {
minimumFractionDigits: 2,
maximumFractionDigits: 2
});
}
function handleInput(event) {
// Remove dots as thousand separators and convert decimal comma to dot
const inputValue = event.target.value.replace(/\./g, '').replace(/,/g, '.');
// Update numericValue with parsed float
numericValue = parseFloat(inputValue);
// Update formattedValue for display
formattedValue = formatNumber(numericValue);
}
</script>
<input type="text" value={formattedValue} on:input={handleInput} />
<p>Numeric value: {numericValue}</p>
Sebaik-baiknya saya ingin memaparkan nilai terformat pada acara input. Tetapi ia juga boleh muncul pada acara semasa perubahan. Atau gunakan butang di sebelah atau sesuatu. Sebarang petua akan sangat dihargai! :)
