jQuery noconflict（）不工作

第一个脚本不工作，第二个脚本不工作。jQuery noconflict（）不工作

<script type="text/javascript"> 
    var pageHits = [30,60,22,5,60,88,102]; 
    var rssHits = [33,45,121,23,55,35,77]; 
    var xAxis = ['Jan 2009', 'Feb 2009', 'Mar 2009', 'Apr 2009', 'May 2009', 'June 2009', 'Jul 2009']; 


    jQuery(function() { 

     $.jqplot('chartDiv', [pageHits, rssHits], CreateLineChartOptions()); 

     $('#barChartButton').click(function() { 
      $('#chartDiv').html(''); 
      $.jqplot('chartDiv', [pageHits, rssHits], CreateBarChartOptions()); 
     }); 
     $('#lineChartButton').click(function() { 
      $('#chartDiv').html(''); 
      $.jqplot('chartDiv', [pageHits, rssHits], CreateLineChartOptions()); 
     }); 
     $('#stackedBarChartButton').click(function() { 
      $('#chartDiv').html(''); 
      $.jqplot('chartDiv', [pageHits, rssHits], CreateStackedBarChartOptions()); 
     }); 
    }); 

    function CreateLineChartOptions() 
    { 
     var optionsObj = { 
      title: 'Blog Statistics', 
      axes: { 
       xaxis: { 
        renderer: $.jqplot.CategoryAxisRenderer, 
        ticks: xAxis 
       } 
      }, 
      series: [{label:'Page Hits'}, {label: 'RSS Hits'}], 
      seriesDefaults:{ 
       markerOptions:{ 
        show: true, 
        style: 'diamond' 
       } 
      }, 
      legend: { 
       show: true, 
       location: 'nw' 
      }, 
      highlighter: { 
       showTooltip: true, 
       tooltipFade: true 
      } 
     }; 
     return optionsObj; 
    } 

    function CreateBarChartOptions() 
    { 
     var optionsObj = { 
      title: 'Blog Statistics', 
      axes: { 
       xaxis: { 
        renderer: $.jqplot.CategoryAxisRenderer, 
        ticks: xAxis 
       } 
      }, 
      series: [{label:'Page Hits'}, {label: 'RSS Hits'}], 
      legend: { 
       show: true, 
       location: 'nw' 
      }, 
      seriesDefaults:{ 
       shadow: true, 
       renderer:$.jqplot.BarRenderer, 
       rendererOptions:{ 
        barPadding: 8, 
        barMargin: 10 
       } 
      }, 
      highlighter: { 
       showTooltip: true, 
       tooltipFade: true 
      } 
     }; 
     return optionsObj; 
    } 

    function CreateStackedBarChartOptions() 
    { 
     var optionsObj = { 
      stackSeries: true, 
      title: 'Blog Statistics', 
      axes: { 
       xaxis: { 
        renderer: $.jqplot.CategoryAxisRenderer, 
        ticks: xAxis 
       } 
      }, 
      series: [{label:'Page Hits'}, {label: 'RSS Hits'}], 
      legend: { 
       show: true, 
       location: 'nw' 
      }, 
      seriesDefaults:{ 
       shadow: true, 
       renderer:$.jqplot.BarRenderer 
      }, 
      highlighter: { 
       showTooltip: true, 
       tooltipFade: true 
      } 
     }; 
     return optionsObj; 
    } 
</script> 
<script language="javascript"> 
    jQuery("#red").treeview({ 
    animated: "fast", 
    collapsed: true, 
    control: "#treecontrol", 
    } 
    }); 
</script>

第一个脚本为可折叠的树和所述第二对的图表..时分别输出为细，但是当我试图实现无论是在一个页面中，树没有被正确产生，但图表执行没问题。

来源

2011-06-05 draxxxeus

你是什么意思由*不工作就*？ – 2011-06-05 06:31:57

嗨Sudeep，欢迎来到Stackoverflow。你能不能添加更多的东西，而不仅仅是代码。解释错误是什么/看起来像。哪些浏览器受到影响。如果您使用Firefox，请从JavaScript控制台发布错误消息。创建一个[JSFiddle]（http://jsfiddle.net/）让我们玩弄它。试着让我们更容易帮助你，而不是只是在这里倾销你的代码，并说“请帮助..” – nfechner 2011-06-05 06:35:26

第一个脚本是可折叠树，第二个脚本是图表..当单独执行时，输出很好，但是当我尝试在一个页面中实现这两种情况时，树不能正确生成，但图表正常。 – draxxxeus 2011-06-05 06:36:22

看看这个：

jQuery(function() { 

     $.jqplot('chartDiv', [pageHits, rssHits], CreateLineChartOptions()); 
     /*......*/ 
     });

如果你喜欢用美元符号使用jQuery.noConflict()时访问jQuery的功能里面，你需要通过$作为参数传递给函数：

jQuery(function($) { 

      $.jqplot('chartDiv', [pageHits, rssHits], CreateLineChartOptions()); 
      /*......*/ 
      });

您还需要与更换的$内CreateLineChartOptions））所有出现（，CreateBarChartOptions（）和CreateStackedBarChartOptions（jQuery的，当使用jQuery.noConflict（）时，没有全局变量$指向jQuery，这就是问题所在。

所以这个编辑版本应该工作：

var pageHits = [30,60,22,5,60,88,102]; 
    var rssHits = [33,45,121,23,55,35,77]; 
    var xAxis = ['Jan 2009', 'Feb 2009', 'Mar 2009', 'Apr 2009', 'May 2009', 'June 2009', 'Jul 2009']; 


    jQuery(function($) { 

     $.jqplot('chartDiv', [pageHits, rssHits], CreateLineChartOptions()); 

     $('#barChartButton').click(function() { 
      $('#chartDiv').html(''); 
      $.jqplot('chartDiv', [pageHits, rssHits], CreateBarChartOptions()); 
     }); 
     $('#lineChartButton').click(function() { 
      $('#chartDiv').html(''); 
      $.jqplot('chartDiv', [pageHits, rssHits], CreateLineChartOptions()); 
     }); 
     $('#stackedBarChartButton').click(function() { 
      $('#chartDiv').html(''); 
      $.jqplot('chartDiv', [pageHits, rssHits], CreateStackedBarChartOptions()); 
     }); 
    }); 


    function CreateLineChartOptions() 
    { 
     var optionsObj = { 
      title: 'Blog Statistics', 
      axes: { 
       xaxis: { 
        renderer: jQuery.jqplot.CategoryAxisRenderer, 
        ticks: xAxis 
       } 
      }, 
      series: [{label:'Page Hits'}, {label: 'RSS Hits'}], 
      seriesDefaults:{ 
       markerOptions:{ 
        show: true, 
        style: 'diamond' 
       } 
      }, 
      legend: { 
       show: true, 
       location: 'nw' 
      }, 
      highlighter: { 
       showTooltip: true, 
       tooltipFade: true 
      } 
     }; 
     return optionsObj; 
    } 

    function CreateBarChartOptions() 
    { 
     var optionsObj = { 
      title: 'Blog Statistics', 
      axes: { 
       xaxis: { 
        renderer: jQuery.jqplot.CategoryAxisRenderer, 
        ticks: xAxis 
       } 
      }, 
      series: [{label:'Page Hits'}, {label: 'RSS Hits'}], 
      legend: { 
       show: true, 
       location: 'nw' 
      }, 
      seriesDefaults:{ 
       shadow: true, 
       renderer:jQuery.jqplot.BarRenderer, 
       rendererOptions:{ 
        barPadding: 8, 
        barMargin: 10 
       } 
      }, 
      highlighter: { 
       showTooltip: true, 
       tooltipFade: true 
      } 
     }; 
     return optionsObj; 
    } 

    function CreateStackedBarChartOptions() 
    { 
     var optionsObj = { 
      stackSeries: true, 
      title: 'Blog Statistics', 
      axes: { 
       xaxis: { 
        renderer: jQuery.jqplot.CategoryAxisRenderer, 
        ticks: xAxis 
       } 
      }, 
      series: [{label:'Page Hits'}, {label: 'RSS Hits'}], 
      legend: { 
       show: true, 
       location: 'nw' 
      }, 
      seriesDefaults:{ 
       shadow: true, 
       renderer:jQuery.jqplot.BarRenderer 
      }, 
      highlighter: { 
       showTooltip: true, 
       tooltipFade: true 
      } 
     }; 
     return optionsObj; 
    } 
</script>

来源

2011-06-05 08:56:23

jQuery noconflict（）不工作

回答

相关问题