jqueryを使用して実行時に選択したオプションの値を変更する方法は？

Question

他の入力の値に基づいて、実行時に選択したオプションの値を変更したいとします。 ex。ユーザーは、年の入力に値を入力し、学期select要素からオプションを選択したときに、私は次の操作を実行しようと 「年+学期」であるように選択さ学期の値を変更したい：

$('select#graduationSemester').live("change", function(){ 
     var year = $('#graduationYear').val(); 
     var sem = $(this).val(); 
     var semStr = $(this).text(sem); 
     $("select#graduationSemester option[value='"+sem+"']").remove(); 
     sem = year+sem; 
     $('select#graduationSemester').append($('<option value = "'+sem+'"/>').text(semStr)); 
     $('select#graduationSemester').val(sem); 

    }); 

選択したオプションを削除し、新しい値を新しいオプションに追加します。 しかし、コードを実行してselectオプションの1つを選択すると、select要素が空になります。どうして？どのように動かすのか？

Answer 1

var semStr = $(this).text(sem);あなたの選択を取り除くつもりです。あなたはかなり新しいものを作成するよりも、既存のオプションを変更することを検討することをお勧めしますが、これは、問題を解決します

var semStr = $(this).find("option:selected").text(); 

：私はあなたがするもので信じることは、このでした。新しいものを追加すると、リストの最後に追加されます。このような何か：

$('select#graduationSemester').live("change", function() { 
    var $this = $(this); 
    var year = $('#graduationYear').val(); 
    var sem = $this.val(); 

    $this.find("option:selected").attr("value",year + sem); 
}); 

http://jsfiddle.net/NWbXt/1