Ajax中open()方法调用疑问：是否需为每个函数单独建文件？

No, you definitely don’t need to create a separate file for every function you want to invoke via Ajax. That’s not the standard or efficient way to handle this—you can (and should) use a single server-side endpoint to handle multiple actions.

How It Works #

The key is to send additional data along with your Ajax request to tell the server which function you want to run. Here’s a simple example to illustrate:

Client-Side Ajax Code

Let’s say you’re using vanilla JavaScript for your Ajax calls. You can pass an action parameter to specify which function to execute:

// Trigger generateGeometricShapes() via Ajax
function callGenerateShapes() {
  const xhr = new XMLHttpRequest();
  xhr.open('POST', '/shapeHandler.php', true);
  xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
  
  xhr.onload = function() {
    if (this.status === 200) {
      // Handle the response from the server
      console.log('Shape generation result:', this.responseText);
    }
  };
  
  // Send the action identifier to the server
  xhr.send('action=generateShapes');
}

// Trigger colorShapes() via Ajax
function callColorShapes() {
  const xhr = new XMLHttpRequest();
  xhr.open('POST', '/shapeHandler.php', true);
  xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
  
  xhr.onload = function() {
    if (this.status === 200) {
      // Handle the response from the server
      console.log('Shape coloring result:', this.responseText);
    }
  };
  
  // Send a different action identifier
  xhr.send('action=colorShapes');
}

Server-Side Handler (e.g., PHP)

Then, in your single server-side file (shapeHandler.php), you check the action parameter and route the request to the corresponding function:

<?php
// Define your core functions
function generateGeometricShapes() {
  // Add your shape generation logic here
  return "Created circles, squares, and triangles successfully!";
}

function colorShapes() {
  // Add your shape coloring logic here
  return "Colored all shapes with random hues!";
}

// Handle the incoming Ajax request
if ($_SERVER['REQUEST_METHOD'] === 'POST') {
  $action = $_POST['action'] ?? '';
  
  switch ($action) {
    case 'generateShapes':
      echo generateGeometricShapes();
      break;
    case 'colorShapes':
      echo colorShapes();
      break;
    default:
      echo "Error: Invalid action requested!";
  }
}
?>

Why This Approach Is Better #

• Less clutter: No need to manage dozens of tiny files for each function.
• Easier maintenance: All shape-related logic lives in one place, making updates and debugging simpler.
• Scalable: Adding a new function just requires adding a new case to the switch statement and a corresponding client-side call—no new files needed.

For Framework Users #

If you’re working with a backend framework (like Express.js for Node.js, Django for Python, etc.), the pattern is similar but uses structured routes and controllers. For example, in Express, you might have a /api/shapes POST route that reads the action parameter from the request body and calls the appropriate controller function.

So to wrap up: You don’t need n files for n Ajax calls. A single endpoint that uses parameters to route requests to the right function is the standard, efficient implementation.

内容的提问来源于stack exchange，提问作者Hajar Elkoumikhi