Javascript işi verilecektir. - 500 TL

Merhaba, html sayfamızda bulunan fiyat inputu için bazı özelleştirmeler istiyoruz.
Sadece sayısal değer girilsin.
varsayılan format 0,00 olsun
eğer value değeri var ise örneğin 124,93 ben silmeye bastığımda 1 defa silersem 124,90 olsun.
imleç virgülün sol tarafında ise sadece noktaya veya virgüle basınca virgülün sağ tarafındaki değerleri değiştirmek için sağa geçiş yapsın.
Kısacası hepsiburada veya trendyol satıcı panellerindeki gibi bir price inputu istiyoruz.

Not: Lütfen bilgisi olmayan arkadaşlar sorunu chatgpt ye yazıp ulaşmasın.
Fiyat: 500 TL
Örnek video: https://streamable.com/wvs502

function onlyNumbers(event) {
  var key = event.keyCode || event.which;
  key = String.fromCharCode(key);
  var regex = /^[0-9.,]+$/;
  if (!regex.test(key)) {
    event.returnValue = false;
    if (event.preventDefault) event.preventDefault();
  }
}

Bu kod, sadece sayısal karakterleri (0-9), nokta (.) ve virgül (,) kabul eder. Bu fonksiyonu input elementinin onkeypress özelliği ile birleştirerek kullanabilirsiniz:

<input type="text" onkeypress="onlyNumbers(event)">

İkinci özellik için, varsayılan değer formatı için aşağıdaki JavaScript kodunu kullanabilirsiniz:

function formatPrice(price) {
  var formattedPrice = parseFloat(price).toFixed(2);
  return formattedPrice.replace(".", ",");
}

Bu fonksiyon, girilen fiyatı 0,00 formatına dönüştürür. Örneğin, 12.5 girilirse 12,50 olarak formatlanır. Bu fonksiyonu input elementinin value özelliğine atayarak varsayılan değeri ayarlayabilirsiniz:

<input type="text" value="0,00" onkeypress="onlyNumbers(event)" onchange="this.value=formatPrice(this.value)">

Üçüncü özellik için, input alanında value değiştiğinde kontrol yapmanız gerekiyor. Bunun için onchange olayını kullanabilirsiniz. Aşağıdaki JavaScript kodu, input alanında value değiştiğinde, 124,93 değerinin 124,90 olarak güncellenmesini sağlar:

function roundPrice(price) {
  var formattedPrice = parseFloat(price.replace(",", ".")).toFixed(2);
  var lastChar = price.slice(-1);
  var roundDownPrice = formattedPrice.replace(".", ",");
  if (lastChar === ",") {
    return roundDownPrice;
  }
  return roundDownPrice.replace(",", ".");
}

Bu fonksiyon, fiyatı 0,00 formatından float bir sayıya dönüştürür ve son karakter virgül ise, değeri virgüle yuvarlar. Son olarak, bu fonksiyonu input elementinin onchange özelliğiyle birleştirerek kullanabilirsiniz:

<input type="text" value="0,00" onkeypress="onlyNumbers(event)" onchange="this.value=roundPrice(this.value)">

Dördüncü özellik için, input alanındaki imleç virgülün sol tarafında olduğunda, sağa geçiş yapılması gerekiyor. Bunun için aşağıdaki JavaScript kodunu kullanabilirsiniz:

function moveCursorRight(event, element) {
  var caretPos = element.selectionStart;
  if (element.value[caretPos-1] === ",") {
    element.selectionStart = caretPos+1;
    element.selectionEnd = caretPos+1;
    event.preventDefault();
  }
}

Bu fonksiyon, input alanında imleç virgülün sol tarafındaysa, imlecin sağa doğru kaydırılmasını sağlar. Bu fonksiyonu input elementinin onkeydown özelliğiyle birleştirerek kullanabilirsiniz:

<input type="text" value="0,00" onkeypress="onlyNumbers(event)" onchange="this.value=roundPrice(this.value)" onkeydown="moveCursorRight(event, this)">

Bu şekilde, istediğiniz özelliklere sahip bir price inputu oluşturabilirsiniz. Ancak, kullanıcının hatalı girişler yapmasını engelleyemeyebilirsiniz. Kullanıcıların girdiği değerleri doğrulamak ve hataları düzeltmek için ek kontroller eklemeniz gerekebilir. Ayrıca, kullanıcının farklı ülke veya bölge ayarlarına göre farklı fiyat formatları kullanabileceğini de göz önünde bulundurmanız gerekiyor.

https://jsfiddle.net/n0e3uavm/

çalışmıyor hocam 00 ı silin değer girmeye çalışın veya videoyu izleyin farkı anlarsınız

Ben de çalışıyor.video izlemedim.

maalesef bu işimize yaramıyor tam olarak videodaki gibi istiyoruz.