列表选择mysql [关闭]

I have a database with soccer teams. I get all this teams in a list like this :

<form method="GET" action="">
    <select name="team1">
    <option value="1">England</option>
    <option value="2">Spain</option>
    <option value="3">Italia</option>
    <option value="4">Germany</option>
    </select>
</form>

I want to made some soccer matches between this teams. So, I choose a team in this 1st list and I chose the other team in the 2nd list.

<form method="GET" action="">
    <select name="team2">
    <option value="1">England</option>
    <option value="2">Spain</option>
    <option value="3">Italia</option>
    <option value="4">Germany</option>
    </select>
</form>

But I want that in the second list, there is all teams except the team that I select in the first list. Can you help me please ? thank you !

$("select[name=team1]").on( 'change', function(e) {
    var val = $(this).val();
    $("select[name=team2] option[value="+val+"]").hide();
    $("select[name=team2] option").not( "option[value="+val+"]" ).show();

    $("select[name=team2]").val( $("select[name=team2] option:visible").val() );

});

1. hide selected option
2. show all other options
3. set value to first option that is visible

You can try something like this:

(i gave an id to both select)

$('#team1').change(function(){
    $('#team2').find('option[value*="'+ this.value +'"]').remove();
}).change();

Fiddle Demo

updates:

I have added default option in both teams:

<option value="0">Select team1</option>  //<----in team 1
<option value="0">Select team2</option>  //<----in team 2

$(document).ready(function(){
  var options = $('#team2').html(); //<--cache your options for team2 here outside
  $('#team1').change(function () {
     if (this.value !== '0') {
       $('#team2').find('option[value*="' + this.value + '"]').hide();//<-hide here
     } else {
       $('#team2').html(options); //<----else show all the options
     }
   });
});

Fiddle for updated one