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（）不工作

回答

相關問題