2016-11-11 1 views
0

Dies ist mein Code mit this version of jqueryjquery bekommen funktioniert nicht wie pro Dokumentation

<script> 

    jQuery(document).ready(function() 
    { 
     $("#theOption").change(function() 
     { 
      var urlString = ''; 

      if (this.value == 1) { 
       urlString = 'http://localhost:10304/jsondata/1.json'; 
      } 
      else { 
       urlString = 'http://localhost:10304/jsondata/2.json'; 
      } 



      alert("About to call service."); 
      $.get(urlString, function (data) 
      { 
       alert('data returned: ' + data); 
       $("#results").html(data); 
       alert("Load was performed."); 
      }); 
     }); 


    }); 

</script> 


<div class="row"> 
    Select 
    <select id="theOption"> 
     <option value="1">one</option> 
     <option value="2">two</option> 

    </select> 
</div> 

<div id="results"> 


</div> 

Bei Änderung der Dropdown erhalte ich die Warnung About to call service Nachricht. Wenn ich dann die Netzwerk-Tools des Browsers sehe, kann ich auch die json-URL wie in der Drop-down-Liste ausgewählt sehen. Dies bedeutet, dass bis zum Aufruf der URL alles funktioniert. Die Warnung data returned wird jedoch nicht aufgerufen, und die resultierende Div-Ebene ruft auch nicht die Werte aus der angegebenen json-URL ab. Nach dieser Dokumentation here mache ich nichts falsch. Also, was ist los?

+0

Könnte das Problem mit Ihrer URL sein, nach Ihrem Code, es scheint, dass Sie Ihre lokale Json-Datei zugreifen. Wenn ja, versuchen Sie es mit Ihrer Ordnerstruktur anstelle von 'http: // localhost: 10304/jsondata/1.json'. – Samir

+0

Es scheint, dass Ihre URL nicht korrekt ist https://jsfiddle.net/7vbok82s/ –

Antwort

1

Dies kann Ihnen keine funktionierende Lösung bringen, wird Ihnen aber auf jeden Fall helfen, das Problem zu beurteilen.

Fügen Sie den fail Handler zu Ihrem Ajax-Anruf und sehen, ob das etwas zurückgibt.

$.get(urlString, function (data) 
{ 
    alert('data returned: ' + data); 
    $("#results").html(data); 
    alert("Load was performed."); 
}).fail(function(jqXHR, textStatus, errorThrown) { 
    alert("Ajax Error: "+textStatus); 
}); 

Weitere Informationen hierzu finden Sie unter here.

Darüber hinaus sollte der gleiche Fehler (wenn es existiert) auch in der Browser-Konsole angezeigt werden.

+0

Interessant. Mein JSON war nicht im richtigen Format. Obwohl ich verstehe nicht, wie '{ \t "color": "blau", \t "Wert": "some var" }' kann anders sein '{ \t Farbe: "Blau", \t Wert: "einige var" } ' – user20358

0

Möglicherweise ist das Problem mit Ihrer URL. Ihrem Code nach scheint es, dass Sie auf Ihre lokale JSON-Datei zugreifen. Wenn ja, dann versuchen Sie Ihre Ordnerstruktur anstelle von 'http://localhost:10304/jsondata/1.json'.

1

was Sie von URL zurückkehren, haben einen Blick auf die folgende Beispiel

$("#theOption").change(function() 
    { 
     var urlString = ''; 

     if (this.value == 1) { 
      urlString = 'http://ip.jsontest.com/'; 
     } 
     else { 
      urlString = 'http://ip.jsontest.com/'; 
     } 



     alert("About to call service."); 
     $.get(urlString, function (data) 
     { 
      alert('data returned: ' + data.ip); 
      $("#results").html(data.ip); 
      alert("Load was performed."); 
     }); 
    }); 
0

ich denke .get $ für das Erhalten von Daten von Server-Seite gemeint ist. Sie können also keine Daten von json abrufen. es funktioniert gut, wenn ich 1.jsom und 2.json zu php ändere und eine Zeichenkette in dieser php Datei widerspreche.

<script src="jquery-1.8.1.js"></script> 
<script> 

    jQuery(document).ready(function() 
    { 
     $("#theOption").change(function() 
     { 
      var urlString = ''; 

      if (this.value == 1) { 
       urlString = '1.php'; 
      } 
      else { 
       urlString = '2.php'; 
      } 



      alert("About to call service."); 
      $.get(urlString).done(function (data) 
      { 
       alert('data returned: ' + data); 
       $("#results").html(data); 
       alert("Load was performed."); 
      }); 
     }); 


    }); 

</script> 


<div class="row"> 
    Select 
    <select id="theOption"> 
     <option value="1">one</option> 
     <option value="2">two</option> 
    </select> 
</div> 

<div id="results"> 


</div> 

und das, was ich in PHP-Datei getan

<?php 
echo "saasfafassfafafafsasf"; 
?> 
Verwandte Themen