2016-05-17 82 views
0

問題:艾瑪迪斯機場自動完成功能使用jQuery

試圖讓自動填充功能與艾瑪迪斯機場自動完成的工作可以在這裏找到:

https://sandbox.amadeus.com/travel-innovation-sandbox/apis/get/airports/autocomplete

小例子:

<!DOCTYPE html> 
<html lang="en"> 

<head> 
    <meta charset="utf-8"> 
    <title>jQuery UI Autocomplete</title> 
    <link rel="stylesheet" href="//code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css"> 
    <script src="//code.jquery.com/jquery-1.10.2.js"></script> 
    <script src="//code.jquery.com/ui/1.10.4/jquery-ui.js"></script> 
    <style> 
    #city { 
     width: 25em; 
    } 
    </style> 
    <script> 
    $(function() { 
     function log(message) { 
     $("<div>").text(message).prependTo("#log"); 
     $("#log").scrollTop(0); 
     } 
     $("#city").autocomplete({ 
     source: function(request, response) { 
      $.ajax({ 
      url: "http://api.sandbox.amadeus.com/v1.2/airports/autocomplete", 
      dataType: "json", 
      data: { 
       apikey: "SECRET", 
       term: request.term 
      }, 
      success: function(data) { 
       response(data); 
      } 
      }); 
     }, 
     minLength: 3, 
     select: function(event, ui) { 
      log(ui.item ? 
      "Selected: " + ui.item.label : 
      "Nothing selected, input was " + this.value); 
     }, 
     open: function() { 
      $(this).removeClass("ui-corner-all").addClass("ui-corner-top"); 
     }, 
     close: function() { 
      $(this).removeClass("ui-corner-top").addClass("ui-corner-all"); 
     } 
     }); 
    }); 
    </script> 
</head> 

<body> 
    <div class="ui-widget"> 
    <label for="city">Your city: </label> 
    <input id="city"> 
    </div> 
    <div class="ui-widget" style="margin-top:2em; font-family:Arial"> 
    Result: 
    <div id="log" style="height: 200px; width: 300px; overflow: auto;" class="ui-widget-content"></div> 
    </div> 
</body> 

</html> 

期望的輸出:

要在列表中輸入機場列表。感謝有人能指出我錯過了什麼。

回答

1

原來的答案很簡單。 Safari 9.0似乎阻止了「不安全的內容」,我只需將http://更改爲https://就可以運行。