dijit表单水平滑是越来越加载只有第一次？(Dijit form horizontalSlider

我使用的道场脚本创建图表，缩放和平移操作我用的dijit滑块。 第一次滑块得到正确加载，但第二次（回来后形成另一页）图是越来越加载除了这些滑块。 使用jQuery的事件处理。 清爽的页面后，它的正常工作。

第一次是CSS

<table>
  <tbody>
        <tr>
        <td class="pad" align="center">ZOOM X(<span id="scaleXValue">1</span></td></tr>
        <tr>
        <td>
          <table widgetid="scaleXSlider" id="scaleXSlider" style="width: 450px;" class="dijit dijitReset dijitSlider dijitSliderH" rules="none" data-dojo-attach-event="onkeydown:_onKeyDown, onkeyup:_onKeyUp" role="presentation" border="0" cellpadding="0" cellspacing="0" lang="en">
            <tbody>
              <tr class="dijitReset"><td class="dijitReset" colspan="2">
                <td data-dojo-attach-point="topDecoration" class="dijitReset dijitSliderDecoration dijitSliderDecorationT dijitSliderDecorationH"></td>
                <td class="dijitReset" colspan="2"></td>
              </tr>

              <tr class="dijitReset">
                 <td class="dijitReset dijitSliderButtonContainer dijitSliderButtonContainerH">
                    <div class="dijitSliderDecrementIconH" style="display:none" data-dojo-attach-point="decrementButton">
                       <span class="dijitSliderButtonInner">-</span>
                    </div>
                 </td>
                 <td class="dijitReset">
                    <div class="dijitSliderBar dijitSliderBumper dijitSliderBumperH dijitSliderLeftBumper" data-dojo-attach-event="press:_onClkDecBumper"></div>
                 </td>
                 <td class="dijitReset">
                    <input value="1" data-dojo-attach-point="valueNode" type="hidden">
                        <div class="dijitReset dijitSliderBarContainerH" role="presentation" data-dojo-attach-point="sliderBarContainer">
                          <div style="width: 0%;" role="presentation" data-dojo-attach-point="progressBar" class="dijitSliderBar dijitSliderBarH dijitSliderProgressBar dijitSliderProgressBarH" data-dojo-attach-event="press:_onBarClick">
                            <div class="dijitSliderMoveable dijitSliderMoveableH">
                              <div aria-valuenow="1" tabindex="0" aria-valuemax="5" aria-valuemin="1" data-dojo-attach-point="sliderHandle,focusNode" class="dijitSliderImageHandle dijitSliderImageHandleH" data-dojo-attach-event="press:_onHandleClick" role="slider"></div>
                            </div>
                          </div>
                          <div style="width: 100%;" role="presentation" data-dojo-attach-point="remainingBar" class="dijitSliderBar dijitSliderBarH dijitSliderRemainingBar dijitSliderRemainingBarH" data-dojo-attach-event="press:_onBarClick">
                          </div>
                        </div>
                 </td>
                 <td class="dijitReset">
                   <div class="dijitSliderBar dijitSliderBumper dijitSliderBumperH dijitSliderRightBumper" data-dojo-attach-event="press:_onClkIncBumper"></div>
                  </td>
                  <td class="dijitReset dijitSliderButtonContainer dijitSliderButtonContainerH">
                    <div class="dijitSliderIncrementIconH" style="display:none" data-dojo-attach-point="incrementButton">
                      <span class="dijitSliderButtonInner">+</span>
                    </div>
                  </td>
                </tr>
                <tr class="dijitReset">
                  <td class="dijitReset" colspan="2"></td>
                  <td data-dojo-attach-point="containerNode,bottomDecoration" class="dijitReset dijitSliderDecoration dijitSliderDecorationB dijitSliderDecorationH">
                  </td>
                  <td class="dijitReset" colspan="2"></td>
                </tr>
              </tbody>
             </table>

而第二次就好像，

<table>
    <tbody><tr><td class="pad" align="center">ZOOM X(<span id="scaleXValue">1</span>)</td></tr>
    <tr><td>
            <div id="scaleXSlider" data-dojo-type="dijit/form/HorizontalSlider" value="1" minimum="1" maximum="5" discretevalues="6" showbuttons="false" style="width: 450px;">
            </div>
    </td></tr></table>

所有的CSS类没有得到加载的第二time.Could请你帮我:(。

Answer 1:

道场跟踪的对象/控件它创建由指定的ID。 如果你用相同的ID在对象上再次运行解析器，道场尝试创建第二个实例，但已经有一个，所以应该在你的js控制台抛出异常。

摧毁创建控件/对象ID再次解析同一页面之前。 下面我宣布“部件”作为全局变量，因此，如果任何控件ID是那里只是解析之前摧毁它们。

if(widgets){
    widgets.forEach(function(widget) {
    widget.destroyRecursive();
});
}
widgets =  dojo.parser.parse();

它为我工作。

有关详细信息，请参阅下面的链接

二手dijit的CSS在两页，但只在第一页的工作，在第二页越来越空白页

文章来源: Dijit form horizontalSlider is getting loaded for first time only?