Добавлена ​​возможность выбора кода города

Question

Я хочу выбрать город, переключателе добавил к этому сценарию:

ЯШ:

$(document).ready(function() { 
     var example = $("#example").flatWeatherPlugin({ 
      location: "london", //city and region *required 
     }); 

    }); 

jsfiddle

Answer 1

Поскольку плагин является собственностью, вы должны спросить разработчик, как обновить местоположение. Вероятно, есть функция, которая вносит изменения, а затем вы можете получить новые данные.

Всегда можно удалить контейнер, который удерживает плагин, и добавить его при изменении местоположения, но это не так называемая «хорошая практика».

Вот рабочая демонстрация, но все же поговорите с разработчиком, должен быть способ сделать это, не удаляя элементы HTML.

$(document).ready(function($) { 
 
\t var example = $("#example").flatWeatherPlugin({ 
 
\t \t location: "london", //city and region *required \t 
 
\t }); 
 
\t $('#list').on('change', function(){ 
 
      var location = $(this).val(); 
 
      //remove the previous instance of the element holding the weather plugin 
 
      $("#example").remove(); 
 
      //Recreate the element and append it to the holder 
 
      $("#holder").append('<div id="example"></div>'); 
 
      $("#example").flatWeatherPlugin({ 
 
       location: location, //city and region *required \t 
 
      }); 
 
      $("#example").flatWeatherPlugin('fetchWeather'); 
 
\t }); 
 
});

\t \t \t /* style the container however you please */ 
 
\t \t \t #example { 
 
\t \t \t \t color:#fff; 
 
\t \t \t \t background: #e74c3c; 
 
\t \t \t \t padding: 5px; 
 
\t \t \t \t margin: 30px auto; 
 
\t \t \t \t width: 270px; 
 
\t \t \t \t border-radius: 5px; 
 
\t \t \t } 
 

 
\t \t \t /* styling for this page only, ignore */ 
 
\t \t \t body {background: #95a5a6; font-family: b yekan,sans-serif; background: #ecf0f1; padding: 0; margin: 0;}

<link href="http://www.evanstoneworks.com/scripts/flatWeatherPlugin.css" rel="stylesheet"/> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="http://www.evanstoneworks.com/scripts/jquery.flatWeatherPlugin.min.js"></script> 
 
<div id="holder"> 
 
    <div id="example"></div> 
 
</div> 
 
<select id="list"> 
 
    <option value="london">london</option> 
 
    <option value="tokyo">tokyo</option> 
 
    <option value="paris">paris</option> 
 
</select>

Надежда, что помогает