Question

我有一个正常工作的页面，但是我需要将它嵌入到cms中。当我这样做时，它最初在html编辑器中渲染得很好，但是一旦发布就不会显示一些东西。检查已发布的页面我得到Uncaught Type error: Undefined is not a function。当我单独加载页面时，为什么不会发生这种情况这是不起作用的功能：

    $(function() { //This line is the error
$('#slider').slider({
    disabled: true,
    range: 'min',
    value: 2013,
    min: 1960,
    max: 2013,
    animate: true,

    change: function(event, ui) { 
        $('#header').text('Year: ' + ui.value);

        xA = ui.value;
        //console.log(xA);

        slider2.setState({'highValue': ui.value});
        slider2.draw();

        setChartView();

    }
}); 
});

  <div> 
    <p style="text-align: center; margin-top: -50px;">
            <p style="font-family: Arial, sans-serif; font-style: italic; text-align: center; margin-top:-30px;">Slide to specify a year or press play to animate yearly changes</p>
              <div id="slider" style="width: 400px; margin-left: 28%"></div>
        </p>

  </div>

JSfiddle显示它在普通浏览器中呈现的方式。（注意：我没有打算为jsfiddle调试正确格式化，只是作为它应该看起来的一个例子。并且忽略定位，它被设置为正确适合cms。底部的滑块是我＆＃ 39;我遇到麻烦。）
编辑：我正在使用weebly。

滑块问题 移动滑块时获取Uncaught TypeError: Cannot read property 'nodeName' of null。
HTML：

      <div> 
    <p style="text-align: center; margin-top: -50px;">
    <img src="http://i.imgur.com/rsud8yD.png" id="startSlider" width="40px" height="40px" style="cursor: pointer; text-align: center; position: relative; z-index: 2;"/> 
          <p id ="header" style="text-align: center; font-family: Arial, sans-serif;"><strong>Year: 2013</strong></p>
            <p style="font-family: Arial, sans-serif; font-style: italic; text-align: center; margin-top:-30px;">Slide to specify a year or press play to animate yearly changes</p>
              <div id="slider" style="width: 400px; margin-left: 28%"></div>
        </p>

  </div>

JS：

    $(function() {
    $('#slider').slider({
        disabled: true,
        range: 'min',
        value: 2013,
        min: 1960,
        max: 2013,
        animate: true,

        change: function(event, ui) {

            $('#header').text('Year: ' + ui.value);

            xA = ui.value;
            //console.log(xA);

            slider2.setState({'highValue': ui.value});
            slider2.draw();

            setChartView();

        }
    }); 
  });
  var tmOt;
  function scrollSlider(){
    var slideValue;

    slideValue = $("#slider").slider("value");
    if (slideValue >=0){
      if (slideValue == 2013){
        slideValue= -1;
      }
      $("#slider").slider("value", slideValue + 1);
      //console.log($("#slider").slider("value"));
      tmOt = setTimeout(scrollSlider, 500);
    }
  }
$('#startSlider').click(function (){ //onclick


   if ( $(this).hasClass('pause') ) {
      // Button is paused change to play
      $(this).attr('src', 'http://i.imgur.com/rsud8yD.png')

    clearTimeout(tmOt);

   } else {
      // Button is play change to play

      $(this).attr('src', 'http://i.imgur.com/uEl5R6T.png')

    scrollSlider();

   }
      $(this).toggleClass('pause')
})
    google.visualization.events.addListener(GenderPicker, 'statechange', setChartView);
    google.visualization.events.addOneTimeListener(geoChart, 'ready', function () {
        $('#slider').slider('enable');
        setChartView();
    });

此滑块的值与默认的谷歌图表滑块的最高值相关联，因为此滑块可以更好地查看并允许更多自定义。

同样，这在普通的浏览器窗口中运行良好，当它最初被嵌入但在发布时摸索。

导入cms时为什么会出现未定义的函数错误？

0 个答案: