Estoy tratando de agregar un separador de miles para el resultado .htm(price * num) agregando .digits(); a la var sub . ¿Cómo hago para que el separador de miles funcione en el resultado de var sub ? Como no son val , necesito convertir el resultado en un número antes de agregar los digits(); ¿función?
$(document).ready(function() { $.fn.digits = function() { return this.each(function() { $(this).val( $(this) .val() .replace(/(\d)(?=(\d\d\d)+(?!\d))/g, "$1,") ); }); }; var total = $(".slider__total").html(); var sold = $(".sold").html(); var available = total - sold; var price = $(".cost").html(); var num = $("#num").html(); $(".item__available").html(available); var sub = $("#slider_subtotal") .html(price * num) .digits(); $(".qty").attr({ max: available }); }); <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> sold<span class="sold">3</span>total<span class="slider__total">10</span>available<span class="item__available"></span><input type="range" min="1" value="1" class="qty" name='quantity' oninput="num.value = this.value"><output id="num">0</output>unit: $ <span class="cost">500</span>subtotal: $<span id="slider_subtotal">0</span>En su lugar, podría usar el método Number.prototype.toLocaleString() :
(1234567.567).toLocaleString('en-US') // 1,234,567.567 O, si lo prefiere, también puede mantenerlo "local" para el usuario actual omitiendo el primer argumento: (1234567.567).toLocaleString() se referirá a la configuración regional del navegador y devolverá una cadena de número local adecuada.
$(document).ready(function() { var total = $(".slider__total").text(); var sold = $(".sold").text(); var available = total - sold; var price = $(".cost").text(); $(".item__available").html(available); $(".qty").attr({max: available}) .on("input",function(){ $("#slider_subtotal").text((price * this.value).toLocaleString("en-US",{style:'currency', currency:'USD'})); $("#num").text(this.value) }); }); <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> sold<span class="sold">37</span> total<span class="slider__total">103</span> available<span class="item__available"></span> <input type="range" min="1" value="1" class="qty" name='quantity'> <output id="num">0</output> unit:$<span class="cost">123.4</span> subtotal: <span id="slider_subtotal">$0</span>