<html>

<select id=climate name=climate> 

<option value=1>Cold</option>
<option value=2>Temperate</option>
<option value=3>Hot</option>

</select> Climate<br> <select width=200 id=season name=season> 

<option value=0>Spring</option>
<option value=1>Summer</option>
<option value=0>Autumn</option>
<option value=-1>Winter</option>

</select> Season<br> <a href=“Javascript:getWeather()”>Generate</a> <a href=“Javascript:clearWeather()”>Clear</a><br>

<script type=“text/javascript”> var day = 0; function clearWeather() { 

day = 0;
document.getElementById("weatherResult").innerHTML = "";

} function getWeather() { 

var climate = document.getElementById("climate").value;
var season = document.getElementById("season").value;
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
  if (this.readyState == 4 && this.status == 200) {
   var result = this.responseText.split("", 1);
   day = +day + +result;
   var genResult = this.responseText.substr(1);
   document.getElementById("weatherResult").innerHTML = document.getElementById("weatherResult").innerHTML+genResult;
  }
};
xhttp.open("GET", "weathergen/swwg.php?climate="+climate+"&season="+season+"&day="+day, true);
xhttp.send();

} </script> <style> #climate { 

 width: 200px;

} #season { 

 width: 200px;

} .left { 

 float: left;
 width: 30%;

} #weatherResult { 

 float: left;
 width: 70%;

} </style>

</html>