JavaScript-將選定的下拉列表值傳遞給方法

Question

這可能很簡單，但是我試圖從JSP頁面的下拉列表中捕獲選定的值，並將選定的值用作方法的參數。 我可以在select標記中使用onchange事件來調用Java腳本函數並捕獲值，但是我不確定如何將值發送到方法。 我認為有一種方法可以通過基於Ajax的調用來實現，但是我不確定如何實現。 這是我正在使用的測試代碼的示例。 謝謝。

function getSelected()
  {
    var selectedSource = document.getElementById("myselect").value;
        console.log(selectedSource);
  }


<select name="myselect" id="myselect" onchange="getSelected();">
    <option value="1">One</option>
    <option value="2">Two</option>
    <option value="3">Three</option>
    <option value="4">Four</option>
</select>

Answer 1

我編輯了答案，以使用jQuery將帖子包含到服務器中。

您的javascript函數有兩個錯誤：

• 首先，調用getselected() ，但函數名稱為getSelectedSource() ；
• 其次，您嘗試查找sourceSystem ，但您的ID是myselect 。

使用jQuery進行HTTP發布，並發送參數myselect （例如，其值為selectedSource 。

在您的Servlet中，您可以使用request.getParameter("myselect")獲取此參數

 <script src="http://code.jquery.com/jquery-1.5.js"></script>
 <script>
       function getSelected()
    {
      var selectedSource = $("#myselect").val();
          console.log(selectedSource);
          $.post("test", { myselect : selectedSource},
                   function(data) {
                     alert("Data Loaded: " + data);
                   });              
    }
  </script>

<select name="myselect" id="myselect" onchange="getSelected();">
    <option value="1">One</option>
    <option value="2">Two</option>
    <option value="3">Three</option>
    <option value="4">Four</option>
</select>