Как получить и запустить внешний код JavaScript с помощью Ajax / jquery? - PullRequest
Новая
       3

Как получить и запустить внешний код JavaScript с помощью Ajax / jquery?

1 голос
/ 14 ноября 2011

Я застрял, пытаясь решить эту проблему. Я черпаю некоторую информацию, которая у меня есть в одной из моих баз данных. Из-за моего веб-интерфейса я использую Ajax для вызова другой страницы, которая выполняет все рендеринг. В резюме у меня есть profile.php, который позволяет пользователю выбрать графическое изображение для рендеринга, просто передав параметр ref через GET в stats-render.php. Это частичный код в profile.php: 

<script>
$(document).ready(function() {
    $('tr.table-row').click(function(){ 
    $.ajax({ url: 'stats-render.php', data: {ref: $(this).attr('id')}, type: 'post', success: function(d) {
        //clearInterval(loading);
        $('div.stats-data').html(d);
    }});

    $('div.stats-data').html('<center><img src="css/img/ajax-loader.gif" alt="loader_IMG" /><br>Rendering your stats</center>');
    //var loading = setInterval(function() { $('div.stats-data')[0].innerHTML += '.' }, 1000);
    });
});
</script>

С другой стороны, в stats-render.php я использую каркас диаграммы Google, что если вы вызываете файл stats-render.php напрямую, он работает просто отлично, частичный код: 

<html>
  <head>
    <!--Load the AJAX API-->
    <script type="text/javascript" src="https://www.google.com/jsapi"></script>
    <script type="text/javascript">

      // Load the Visualization API and the piechart package.
      google.load('visualization', '1.0', {'packages':['corechart']});

      // Set a callback to run when the Google Visualization API is loaded.
      google.setOnLoadCallback(drawChart);

      // Callback that creates and populates a data table, 
      // instantiates the pie chart, passes in the data and
      // draws it.
      function drawChart() {

      // Create the data table.
      var data = new google.visualization.DataTable();
      data.addColumn('string', 'Number');
      data.addColumn('number', 'Visits');

    <?php
        $salida = "";
        $fgmembersite->DBLogin();
        $result=mysql_query("SELECT DATE(datetime), COUNT(1) as numVisits FROM stats_ram WHERE type='profile_visit' AND user_url = 'xxx' GROUP BY DATE(DATE_SUB(datetime, INTERVAL 1 DAY))");
        echo "data.addRows([";
        while($row = mysql_fetch_array($result, MYSQL_ASSOC)) {
            $salida = $salida . "['".$row['DATE(datetime)']."', ".$row['numVisits']."],";
        }
        $salida = rtrim($salida, ",");
        echo $salida . "]);";
    ?>

      // Set chart options
      var options = {'title':'Your CV visits by day', 'width':'100%', 'height':300, colors: ['#c7cfc7'], titleTextStyle: {color: '#5c5c5c'}};

      // Instantiate and draw our chart, passing in some options.
      var chart = new google.visualization.ColumnChart(document.getElementById('chart_div'));
      chart.draw(data, options);
      //chart.draw(data, {width: 600, height: 266, colors: ['#c7cfc7'], legendTextStyle: {color:'#666666'}0});
    }
    </script>
  </head>

  <body>
    <!--Div that will hold the pie chart-->
    <div id="chart_div"></div>
  </body>
</html>

Итак, когда вы используете profile.php для загрузки stats-render.php, он не будет работать, и консоль разработчика Chrome предложит вам следующее: 

Uncaught ReferenceError: google is not defined
(anonymous function)
e.extend.globalEvaljquery-1.7.min.js:2
e.extend.globalEvaljquery-1.7.min.js:2
brjquery-1.7.min.js:2
e.extend.eachjquery-1.7.min.js:2
f.fn.extend.domManipjquery-1.7.min.js:4
f.fn.extend.appendjquery-1.7.min.js:3
f.fn.extend.htmljquery-1.7.min.js:4
$.ajax.successprofile.php:97
f.Callbacks.njquery-1.7.min.js:2
f.Callbacks.o.fireWithjquery-1.7.min.js:2
wjquery-1.7.min.js:4
f.support.ajax.f.ajaxTransport.send.djquery-1.7.min.js:4

Я очень уверен, что Ajax-вызов работает, и я очень уверен, что stats-render.php также работает нормально. Итак, есть идеи?

1 Ответ

1 голос
/ 14 ноября 2011

Вы должны использовать $.getScript().Он разработан специально для этого.

...