Question

下面是我输入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字段。但它不适用于generated_qty和var_pay。它会抛出错误＆＃34;＆＃34; [object Object]＆＃34;不是有效号码＆＃39;。需要你的专家帮助。

Answer 1

对于前两种情况，您将DOM元素的id更正为：

<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({

＆＃34; [对象]＆＃34;不是有效的数字jquery滑块

1 个答案: