";[对象对象]";不是有效的数字jquery滑块

"[object Object]" is not a valid number jquery slider

本文关键字:对象 quot 数字 滑块 jquery 有效      更新时间:2023-09-26

下面是我的4个输入的html代码。我使用jquery ui滑块来表示这些百分比字段。

               <div class="turnover">
                      <label for = "{{  form.turnover.id_for_label  }}">Umsatz des verkauften Artikels am Gesamtumsatz</label>
                      {{ form.turnover }}
                      <div id="turnover_slider"></div>
                      {{ form.turnover.errors }}
                </div>
              <div class="clear"></div>
                <div class="sold_qty">  
                      <label for = "{{  form.sold_qty.id_for_label  }}">Zahl der verkauften Menge des Artikels zur gesamten Absatzmenge</label>
                        {{ form.sold_qty }}
                      <div id="sold_qty_slider"></div>
                      {{ form.sold_qty.errors }}
                </div>
              <div class="clear"></div>
                <div class="produced_qty">
                      <label for = "{{  form.produced_qty.id_for_label  }}">Zahl der produzierten Menge des Artikels relativ zur gesamten Produktmenge</label>
                        {{ form.produced_qty }}
                      <div class="produced_qty_slider"></div>         
                        {{ form.produced_qty.errors }}
                </div>
              <div class="clear"></div>
                <div class="var_pay">
                        <label for = "{{  form.var_pay.id_for_label  }}">Prozent der variablen Verg&uuml;tung an der Gesamtverg&uuml;tung</label>
                        {{ form.var_pay }}
                        <div class="var_pay_slider"></div>
                        {{ form.var_pay.errors }}
                    </div>
              <div class="clear"></div>
                    <div class="contracts">
                        <label for = "{{  form.contracts.id_for_label  }}">Anzahl der abgeschlossenen Vertr&auml;ge im Veranlagungszeitraum</label>
                        {{ form.contracts }}
                        {{ form.contracts.errors }}
                </div>

Jquery代码为

$( "#turnover_slider" ).slider({
      range: "max",
      min: 1,
      max: 100,
      slide: function( event, ui ) {
        $( "#id_turnover" ).val( ui.value );
      }
    });
$( "#id_turnover" ).val( $( "#turnover_slider" ).slider( "value" ) );


$( "#sold_qty_slider" ).slider({
      range: "max",
      min: 1,
      max: 100,
      slide: function( event, ui ) {
        $( "#id_sold_qty" ).val( ui.value );
      }
    });
$( "#id_sold_qty" ).val( $( "#sold_qty_slider" ).slider( "value" ) );

$( "#var_pay_slider" ).slider({
      range: "max",
      min: 1,
      max: 100,
      slide: function( event, ui ) {
        $( "#id_var_pay" ).val( ui.value );
      }
    });
$( "#id_var_pay" ).val( $( "#var_pay_slider" ).slider( "value" ) );

滑块适用于前2个输入字段(即营业额和sold_qty字段(。但它不适用于produced_qty和var_pay。它引发错误"[object object]"不是有效数字。需要您的专家帮助。

对于前两种情况,您将id到DOM元素更正为:

<div id="turnover_slider"></div>
<div id="sold_qty_slider"></div>

但对于其余的两个,您分配了class,而不是id。请更正:

<div class="produced_qty_slider"></div>
<div class="var_pay_slider"></div>

或者更改JS代码,将它们的jQuery选择器更改为:

$( ".produced_qty_slider" ).slider({
$( ".var_pay_slider" ).slider({