如何訪問和存儲在按鈕單擊時動態變化的 jsp 頁面的輸入隱藏字段？

Question

這是 jsp 頁面中的腳本

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<a href="#trno=${track.track_no}" class="album-poster" data-switch="${count}" data-value="${track.track_no}">Play Button</a>

<input type="hidden" id="trnum" name="trnum" value="">

這是我寫的js腳本

$(".album-poster").on('click', function(e) {

  var dataSwitchId = $(this).attr('data-switch');
  var datavalue = $(this).attr('data-value');

  //Add value to hidden field.
  $('#trnum').val(datavalue);
  
  //Show hidden field value
  console.log($('#trnum').val())

  ap.list.switch(dataSwitchId);

  ap.play();

  $("#aplayer").addClass('showPlayer');
});

這里的錨標簽在foreach循環中，這樣不同的值就會出現在錨標簽的data-value屬性中

在這里，我想將這些數據值存儲到數據庫中，這樣當我嘗試訪問時

$(".album-poster").on('click', function(e) {

  var dataSwitchId = $(this).attr('data-switch');
  var datavalue = $(this).attr('data-value');

  //Add value to hidden field.
  $('#trnum').val(datavalue);
  
  //Show hidden field value
  console.log($('#trnum').val())
  ****<%System.out.println(request.getParameter("trnum"));%>****

  ap.list.switch(dataSwitchId);

  ap.play();

  $("#aplayer").addClass('showPlayer');
});

在我在控制台中打印的突出顯示的代碼中，它正在打印 null 我需要單擊這些值以將它們存儲到數據庫中，以及如何訪問它們並將它們存儲到 java 列表中。

我該怎么做？

Answer 1

您需要將數據提交到服務器以訪問request object。實現此目的的一種方法是使用datavalue 。您可以將用戶單擊的數據值發送到后端並保存。因此您的ZD223E1439188E478349EZ代碼如下所示：

 $(".album-poster").on('click', function(e) {
    
      var dataSwitchId = $(this).attr('data-switch');
      var datavalue = $(this).attr('data-value');
 //chcking if datavalue is not null
      if (datavalue != null) {
        $.ajax({
          url: "your_backend_url", //url or servlet
          type: "GET",
          data: {
            trnum: datavalue
          }, //pass data to backend access same using request.getParameter("trnum") in doGet method servlet
          success: function(data) {
            console.log("done");//this will print on success in browser console
          }
        });
    
      }
      ap.list.switch(dataSwitchId);
    
      ap.play();
    
      $("#aplayer").addClass('showPlayer');
    });

在后端獲取用戶使用request.getParameter("trnum")傳遞的數據並執行進一步操作。