Thiết kế website giá rẻ

Question

I paste below html code, it load a weather condition by country, example if the user select New York the meteo will show on div “tomorrow”, but if the user change again the country, div will not reload new prevision. I tried some script but I don’t have skill in js, some one can help me?

Thanks

Below the full html project

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
<title>Weather</title>
<style>
 select {
    font-size: 17px;
    margin-top: 10px; 
    border-radius: 25px; 
    padding: 10px; 
    border: 0.5px solid #dedede; 
    width: 100%;
  }
  
  select {
    background-image:
    linear-gradient(45deg, transparent 50%, gray 50%),
    linear-gradient(135deg, gray 50%, transparent 50%),
    linear-gradient(to right, #ccc, #ccc);
    background-position:
    calc(100% - 20px) calc(1em + 2px),
    calc(100% - 15px) calc(1em + 2px),
    calc(100% - 2.5em) 0.5em;
    background-size:
    5px 5px,
    5px 5px,
    1px 1.5em;
    background-repeat: no-repeat;
  }
  
  select {
    -webkit-appearance: none;
    -moz-appearance: none;
    text-indent: 1px;
    text-overflow: '';
  }
</style>
</head>
<body bgcolor="#f9f9f9">
<script>
function changeSim() {
    const select = document.getElementById('select');
    $("#tomorrow").attr(
        "data-location-id",
        select.options[select.selectedIndex].value);
    load(document, 'script', 'tomorrow-sdk');
}

function load(d, s, id) {
    if (d.getElementById(id)) {
        if (window.__TOMORROW__) {
            window.__TOMORROW__.renderWidget();
        }
        return;
    }
    const fjs = d.getElementsByTagName(s)[0];
    const js = d.createElement(s);
    js.id = id;
    js.src = "https://www.tomorrow.io/v1/widget/sdk/sdk.bundle.min.js";
    fjs.parentNode.insertBefore(js, fjs);
};
</script>

<select id="select" onchange="changeSim()">
    <option value="">--Choose an option--</option>
    <option value="000011">Abu Dhabi</option>
    <option value="003919">Adelaide - Australia</option>
    <option value="038587">Addis Abeba - Ethiopia</option>
    <option value="031230">Algeri - Algeria</option>
    <option value="077340">Amsterdam - Netherlands</option>
    <option value="107166">Ankara - Turkey</option>
    <option value="107169">Antalia - Turkey</option>
    <option value="052515">Athens - Greece</option>
    <option value="080561">Arequipa - Peru</option>
    <option value="111590">Atlanta - Georgia</option>
    <option value="111591">Atlanta - Texas</option>
    <option value="111592">Atlanta - Illinois</option>
    <option value="134504">Baghdad - Iraq</option>
    <option value="080561">Bali - Indonesia</option>
    <option value="106448">Bankcog - Thailand</option>
    <option value="032653">Barcelona - Spain</option>
    <option value="111806">Bar Harbor - Maine - USA</option>
    <option value="019332">Beijin - China</option>
    <option value="065936">Beirut - Lebanon</option>
    <option value="097170">Belgrade - Serbia</option>
    <option value="024053">Berlin - Germany</option>
    <option value="017462">Bern - Switzerland</option>
    <option value="112589">Boston - Massachusset - USA</option>
    <option value="104374">Bratislava - Slovakia</option>
    <option value="004411">Brisbane - Australia</option>
    <option value="090347">Bucharest - Romania</option>
    <option value="055263">Budapest - Hungary</option>
    <option value="000704">Buenos Aires - Argentina</option>
    <option value="008693">Bruselles - Belgium</option>
    <option value="031802">Cairo - Egypt</option>
    <option value="016259">Calgary - Canada</option>
    <option value="004566">Canberra - Australia</option>
    <option value="131059">Cape Town - South Africa</option>
    <option value="021114">Cartagena de Indias - Colombia</option>
    <option value="113931">Chicago - Illinois - USA</option>
    <option value="143883">Colombia - Colombia</option>
    <option value="030620">Copenhagen - Denmark</option>
    <option value="080636">Cusco - Peru</option>
    <option value="104704">Dakar - Senegal</option>
    <option value="104988">Damascus - Syria</option>
    <option value="004947">Darwin - australia</option>
    <option value="115253">Denver - Colorado - USA</option>
    <option value="030565">Djibouti - Djibouti</option>
    <option value="000032">Dubai - United Arab Emirates</option>
    <option value="057223">Dublin - Ireland</option>
    <option value="131092">Durban - South Africa</option>
    <option value="138563">Florence - Italy</option>
    <option value="049441">Edinburgh - Germany</option>
    <option value="025211">Frankfurt - Germany</option>
    <option value="2180733">Fuerteventura - Canary Islands - Spain</option>
    <option value="130201">Hanoi - Vietnam</option>
    <option value="038770">Helsinki - Finland</option>
    <option value="130563">Hội An - Vietnam</option>
    <option value="118623">Honolulu - Hawaii - USA</option>
    <option value="034729">Ibiza - Spain</option>
    <option value="118924">Indianapolis - Indiana - USA</option>
    <option value="085475">Islamabad - Pakistan</option>
    <option value="107308">Istanbul - Turkey</option>
    <option value="056293">Jakarta - Indonesia</option>
    <option value="057484">Jerusalem - Israel</option>
    <option value="131136">Joahnnesburg - South Africa</option>
    <option value="000079">Kabul -Afghanistan</option>
    <option value="079735">Kathmandu - Nepal</option>
    <option value="109897">Kyiv - Ukraine</option>
    <option value="076497">Kuala Lumpur - Malaysia</option>
    <option value="2180737">Lanzarote - Canary Islands - Spain</option>
    <option value="034988">Las Palmas - Canary Islands - Spain</option>
    <option value="089245">Lisbon - Portugal</option>
    <option value="120626">Little Rock - Arkansas - USA</option>
    <option value="120163">Las Vegas - Nevada - USA</option>
    <option value="050388">London - UK</option>
    <option value="120784">Los Angeles - California - USA</option>
    <option value="104169">Ljubljana - Slovenia</option>
    <option value="066801">Luxembourg - Luxembourg</option>
    <option value="035186">Madrid - Spain</option>
    <option value="035703">Malaga - Spain</option>
    <option value="083524">Manila - Philippines</option>
    <option value="102864">Mecca - Saudi Arabia</option>
    <option value="021074">Medellin - Colombia</option>
    <option value="006235">Melbourne - Australia</option>
    <option value="140142">Milan - Italy</option>
    <option value="121951">Minneapolis - Minnesota - USA</option>
    <option value="015989">Minsk - Belarus</option>
    <option value="104810">Mogadishu - Somalia</option>
    <option value="044298">Montpelier - France</option>
    <option value="099972">Moskow - Russia</option>
    <option value="133024">Mumbai - India</option>
    <option value="027540">Munich - Germany</option>
    <option value="064845">Nairobi - Kenya</option>
    <option value="140713">Naples - Italy</option>
    <option value="022069">Nicosia - Cyprus</option>
    <option value="122795">New York City - New York - USA</option>
    <option value="133210">New Delhi - India</option>
    <option value="123404">Oklahoma City - USA</option>
    <option value="064214">Osaka - Japan</option>
    <option value="079425">Oslo - Norway</option>
    <option value="2180760">Palma de Mallorca - Spain</option>
    <option value="044856">Paris - France</option>
    <option value="106617">Pattaya - Thailand</option>
    <option value="067364">Podgorica - Montenegro</option>
    <option value="006840">Perth - Australia</option>
    <option value="022970">Prague - Czech Republic</option>
    <option value="2011883">Pristina - Kosovo</option>
    <option value="106650">Phuket - Thailand</option>
    <option value="065231">Pyongyang - North Korea</option>
    <option value="016867">Quebec - Canada</option>
    <option value="067193">Rabat - Morocco</option>
    <option value="135206">Reykjavik - Iceland</option>
    <option value="066948">Riga - Latvia</option>
    <option value="059385">Rimini - Italy</option>
    <option value="014309">Rio De Janeiro - Brazil</option>
    <option value="059582">Roma</option>
    <option value="125577">Sacramento - California - USA</option>
    <option value="125767">Salt Lake City - Utah - USA</option>
    <option value="104700">San Marino - San Marino</option>
    <option value="125809">San Francisco - California - USA</option>
    <option value="125894">Sanibel - Florida - USA</option>
    <option value="001458">Santa Fe - Argentina</option>
    <option value="2090771">Santorini - Greece</option>
    <option value="015101">São Paulo - Brazil</option>
    <option value="037036">Santa Cruz de Tenerife - Canary Island
    <option value="014404">Salvador - Brazil</option>
    <option value="008380">Sarajevo - Bosnia and Herzegovina</option>
    <option value="126104">Seattle - Whashington - USA</option>
    <option value="065498">Seoul - South Korea</option>
    <option value="104057">Singapore - Singapore</option>
    <option value="067526">Skopje - Macedonia</option>
    <option value="009701">Sofia - Bulgaria</option>
    <option value="126572">Solvang - California - USA</option>
    <option value="103758">Stockholm - Sweden</option>
    <option value="007408">Sydney - Australia</option>
    <option value="109031">Taipei - Taiwan</option>
    <option value="031716">Tallinn - Estonia</option>
    <option value="052126">Tbilisi</option>
    <option value="135129">Teheran - Iran</option>
    <option value="000271">Tirana - Albania</option>
    <option value="064500">Tokyo - Japan</option>
    <option value="067032">Tripoli - Lybia</option>
    <option value="107039">Tunisi - Tunisia</option>
    <option value="061575">Turin - Italy</option>
    <option value="067815">Valletta - Malta</option>
    <option value="061822">Venice - Italy</option>
    <option value="017156">Victoria - Canada</option>
    <option value="003681">Vienna - Austria</option>
    <option value="066703">Vilnius - Lithuania</option>
    <option value="088480">Warasw - Poland</option>
    <option value="079915">Wellington - New Zealand</option>
    <option value="055004">Zagreb -  Croatia</option>
</select>
<div style="height:15px;"></div>
<div id="tomorrow" class="tomorrow"
     data-location-id='$("#country_text").text(id)'
     data-language="EN"
     data-unit-system="METRIC"
     data-skin="light"
     data-widget-type="upcoming"
     style="padding-bottom:22px;position:relative;"
     >
    <a
       href="https://www.tomorrow.io/weather-api/"
       rel="nofollow noopener noreferrer"
       target="_blank"
       style="position: absolute; bottom: 0; transform: translateX(-50%); left: 50%;"
       >
        <img
             alt="Powered by the Tomorrow.io Weather API"
             src="https://weather-website-client.tomorrow.io/img/powered-by.svg"
             width="250"
             height="18"
             />
    </a>
</div>
</body>
</html>```


I need to reload div after change the country to select.

Thiết kế website giá rẻ

Danh mục

Reload div after change option to select menu