Question

我有一个<select>元素，其中包含3个选项，并且还具有3个PHP函数。如何设置它，以便在按下每个选项时调用一个不同的PHP函数？据我了解，选择选项是客户端，功能是服务器端。这是否意味着AJAX是必需的？没有AJAX，有没有办法做到这一点？

<select name="mySelect">
  <option value="filter-oa" disabled="disabled" selected>Filter by Open Access</option>
  <option value="full">Fully Open Access</option>
  <option value="offers">Offers Open Access</option>
  <option value="none">No Open Access</option>
</select>

我的3个功能是：getProOA(), getProFullOA(), and getProNoOA() 示例：用户在下拉菜单中选择“完全打开访问”选项，然后调用getProFullOA()函数并在页面上列出产品。

Answer 1

<select name="mySelect">
  <option value="filter-oa" disabled="disabled" selected>Filter by Open Access</option>
  <option value="full">Fully Open Access</option>
  <option value="offers">Offers Open Access</option>
  <option value="none">No Open Access</option>
</select>

这里尝试使用一个简单的ajax调用：

   $(select[name='mySelect']).on('change', function(){
        let val = $('select').find('option[value="' + this.value + '"]');
    })
    let dataString = "callFunction=" + val
   $.ajax({
      url: "Your_php_file.php",
      type: POST,
      data: dataString
    }).done(function(result) {
      $('.where-you-want-the-output').html(result);
    });

只需将其添加到您的代码中即可！

https://api.jquery.com/jquery.ajax/

Answer 2

要执行此操作，您需要将表单发布到服务器：

<?php

if (!empty($_POST['mySelect'])) {
  // this block is only executed if values are received

  switch ($_POST['mySelect']) {
    case 'filter-oa': 
      getProOA();
      break;

    case 'full':
      getProFullOA();
      break;

    case 'none':
      getProNoOA();
      break;

    case 'offers':
      echo 'some offer';
      break;

    default:
      echo 'ERROR';
  }

  die();
}

?>
<form method="POST">
<select name="mySelect">
  <option value="filter-oa" disabled="disabled" selected>Filter by Open Access</option>
  <option value="full">Fully Open Access</option>
  <option value="offers">Offers Open Access</option>
  <option value="none">No Open Access</option>
</select>  
<button type="submit">
</form>

从HTML <Select>选项

2 个答案: