如何使用jQuery在滑块和工具提示光标中添加小数点

Question

我有一个价格范围的滑块。目前，这些值以$ 400的价格显示，在工具提示中，它的400个。但是现在，我想将这些值显示为$ 400.00，在工具提示中应为400.00。我的滑块会在单击，滑动以及加上和减去按钮点击时更改其价值。

这是我的代码：

jQuery(document).ready(function(){
    jQuery("#bootstrap-slider").slider();
  jQuery("#bootstrap-slider").on("slide", function(slideEvt) {
    jQuery("#sliderValue").text(slideEvt.value);
  });
  jQuery('.slider').on("click", function() {
    var newvalue = jQuery('.tooltip-inner').text();
    jQuery("#sliderValue").text(newvalue);
  });
});
</script>
<script type="text/javascript">
  jQuery(document).ready(function() {
    jQuery('.btn-overflow').click(function(){
      jQuery(this).parents('.entry-content').toggleClass('asd');
    });
    jQuery(window).trigger('scroll');
});
  function addSliderPrice(){
    var price=parseInt(jQuery( "#bootstrap-slider" ).slider('getValue'));
    price=price+200;
    if(price<=500000){
      jQuery( "#bootstrap-slider" ).slider('setValue', price);
      jQuery('#sliderValue').text(price);
    }
    else{
      jQuery( "#bootstrap-slider" ).slider('setValue', 500000);
      jQuery('#sliderValue').text(500000);
    }
 }
 function reduceSliderPrice(){
    var price=parseInt(jQuery( "#bootstrap-slider" ).slider('getValue'));
    price=price-200;
     if(price>400){
        jQuery( "#bootstrap-slider" ).slider('setValue', price);
        jQuery('#sliderValue').text(price);
      }
      else{
         jQuery( "#bootstrap-slider" ).slider('setValue', 400);
          jQuery('#sliderValue').text(400);
      }
 }

我该如何实现此视图。任何人都可以发光

Answer 1

您可以使用Number.prototype.toFixed()将数字格式化为定点符号。请注意，这将返回数字的字符串表示形式，因此您应该使用它来打印工具提示中的值。

(400).toFixed(2);
// "400.00"