javascript - 如何将数据从列表组项传递到 PHP 文件？

Question

我正在制作一个简单的三步表单，第一步是在“事物”列表之间进行选择，而不是制作一个无聊的单选按钮，我选择了一个引导列表组。 但是我如何才能将用户选择的值传递给 PHP 文件呢？

我将列表组代码粘贴到这里

  <div id="scelta_materia">
    <form method="POST" action="dopo.php">
      <div class="row spazio_scelta">
        <div class="col-4">
          <div class="list-group" id="list-tab" role="tablist">
            <a class="list-group-item list-group-item-action active" id="list-home-list" data-toggle="list" href="#list-home" role="tab" aria-controls="home">Italiano</a>
            <a class="list-group-item list-group-item-action" id="list-profile-list" data-toggle="list" href="#list-profile" role="tab" aria-controls="profile">Storia</a>
            <a class="list-group-item list-group-item-action" id="list-profile-list" data-toggle="list" href="#list-profile" role="tab" aria-controls="profile">Geografia</a>
            <a class="list-group-item list-group-item-action" id="list-messages-list" data-toggle="list" href="#list-messages" role="tab" aria-controls="messages">Matematica</a>
            <a class="list-group-item list-group-item-action" id="list-settings-list" data-toggle="list" href="#list-settings" role="tab" aria-controls="settings">Scienze</a>
            <a class="list-group-item list-group-item-action" id="list-settings-list" data-toggle="list" href="#list-settings" role="tab" aria-controls="settings">Fisica</a>
            <a class="list-group-item list-group-item-action" id="list-settings-list" data-toggle="list" href="#list-settings" role="tab" aria-controls="settings">Inglese</a>
          </div>
        </div>
      </div>
      <button type="submit" class="btn btn-outline-primary spazio_button">Successivo</button>
    </form>
  </div>

Answer 1

为此，您必须使用一些 JavaScript 代码:

$('#list-tab a').on('click', function (e) {
  e.preventDefault();
  $(this).tab('show');

  // Get user selection
  var userSelection = $(this).text();

  // Check if input does not already exists
  if ($('input[name="my_input"]').length === 0) {
    // Create hidden input
    var input = $('<input type="hidden" name="my_input" />');
    input.val(userSelection)
    // Prepend new input to form
    $('#scelta_materia').find('form').prepend(input);
  } else {
    $('input[name="my_input"]').val(userSelection);
  }
});

例如，如果用户选择 Scienze列出组项，一个 <input type="hidden" name="my_input" value="Scienze" />将添加到表单中。

表单提交后，您可以使用 $_POST['my_input'] 在 PHP 中检索您的输入值

希望对你有帮助:)