jquery javascriptのドロップダウンリストをクリックするとラベルが変更されます

Question

jquery javascriptで複数の関数を実装するにはどうすればよいですか？ 2番目の関数を削除すると、「プロジェクトを取得する」ボタンが正常に機能しています（Eclipseプロジェクトで実際に機能します。何らかの理由で、ここで2番目の関数を削除しても機能しません）。

ここで達成したいことが2つあります。 1）[プロジェクトを取得]をクリックして、プロジェクトをドロップダウンリストに追加します。 2）リストから別のプロジェクトを選択すると、ラベルは選択した内容に基づいてテキストを変更します。

$(document).ready(function() { 
 
     $('#projectbutton').click(function() { 
 
     var selector = document.getElementById('projectselector'); 
 
     var api = "http://localhost:8080/restapi/test/projects"; 
 
     $.getJSON(api, {"1":"project 1", "2":"project 2"},function (data) { 
 
      $.each(data, function (index, d) { 
 
       selector.options[selector.options.length] = new Option(d,d); 
 
      }); 
 
     }); 
 
     }); 
 
}); 
 
$(document).ready(function() { 
 
    $('#projectselector').change(function() { 
 
     var text = $('option:selected',this).text(); 
 
     $('#selectedprojectname').text(text); 
 
    } 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="firstsection"> 
 
    <h1>List project</h1> 
 
    <button id="projectbutton" name="projectbutton">Get Projects</button> 
 
</div> 
 
<div id="secondsection"> 
 
    <h2>All available projects:</h2> 
 
    Projects: <select id="projectselector" name="projectselector"></select> 
 
</div> 
 
<div id="thirdsection"> 
 
    <h3>Selected project:</h3> 
 
    <label id=selectedprojectname name="selectedprojectname">empty</label> 
 
</div>

Answer 1

私はあなたがgetJSON呼び出しで何をしようとしてわかりません。 2番目のパラメータはAPIコールに送信されるデータなので、おそらく渡すものは必要ありません。

いずれにしても、API呼び出しに何か問題があります。 API部分を削除した場合は機能します。

http://jsfiddle.net/CnEUh/3137/

$(document).ready(function() { 
    $('#projectbutton').click(function() { 
    var selector = document.getElementById('projectselector'); 
    var api = "http://localhost:8080/restapi/test/projects"; 
    var data = {"1":"project 1", "2":"project 2"}; 
     $.each(data, function (index, d) { 
     selector.options[selector.options.length] = new Option(d,d); 
     }); 
    }); 

    $('#projectselector').change(function() { 
    var text = $('option:selected',this).text(); 
    $('#selectedprojectname').text(text); 
    }); 
}); 

あなたのjQueryが正常に見えるが、あなたはAPIコードをポストしない限り、私は、APIの呼び出しではもう助けることができません。