單擊jQuery JavaScript中的下拉列表時更改標簽

Question

如何在jquery javascript下實現多個功能？ 如果刪除第二個功能，“獲取項目”按鈕將正常工作（它實際上在我的Eclipse項目中有效，由於某種原因，如果在此處刪除第二個功能，則該按鈕將不起作用）。

我要在這里實現兩件事：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調用中您要做什么。 第二個參數只是發送到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調用將一無所獲。