是否可以将 HTML 输入类存储到 PHP 变量中？

Question

我有一个 html 表单和一些 php 以及一点点 javascript。该表单有两个输入标签。两个输入标签都有类属性。我想将类值“存储”在 PHP 变量中，以便在单击提交后回显。我尝试将 javascript 与第一个 php 变量（$firstclass）集成，但即使作为警报（）也无法使其正常工作。我真的不想提醒类值，但认为这将有助于找到解决方案。<form action="" method="post">    <input type="text" name="input1" class="hidden_class_1">    <input type="text" name="input2" class="hidden_class_2">    <input type="submit" name="submit"></form><?php$firstclass = ""; //hidden_class_1$secondclass = ""; //hidden_class_2$firstclass = "<script type=\"application/javascript\">alert(('this.className').attr('class'))</script>";$secondclass = ""; //ideally hidden_class_2if(isset($_POST['submit'])){    echo "<h2>First Input Class Value: ".$firstclass."</h2>";    echo "<h2>Second Input Class Value: ".$secondclass."</h2>";}我希望输出如下；第一个输入类值： hidden_class_1第二个输入类值： hidden_class_2

Answer 1

“最简单”的方法是使用 AJAX/XHR 并将类发送到 PHP 脚本。

<form id="ajaxform" action="path/to/script.php" method="post">

  <input type="text" name="input1" class="hidden_class_1">

  <input type="text" name="input2" class="hidden_class_2">

  <input type="submit" name="submit">

</form>

例如，使用 jQuery：

const $form = $('#ajaxform');

function onSuccess (response) {

  console.log('Successfully submitted the form');

  console.log('Server responded with', response);

}

function onFailure (jqXhr, status) {

  console.log('Ooops, something went wrong!');

  console.log('Server sent status code', status);

}

$form.on('submit', event => {

  event.preventDefault(); // suppress the reload

  const $input1 = $form.find('[name=input1]');

  const $input2 = $form.find('[name=input2]');

  $.ajax({

    method: $form.prop('method').toUpperCase(),

    url: $form.prop('action'),

    data: {

      input1Value: $input1.val(),

      input2Value: $input2.val(),

      input1Class: $input1.prop('className'),

      input2Class: $input2.prop('className')

    }

  }).

  done(onSuccess).

  fail(onFailure);

});

在您的 PHP 中，您将使用$_POST(或$_REQUEST) 来获取已发送的值：

$input1_value = $_POST['input1Value'];

$input2_value = $_POST['input2Value'];

$input1_class = $_POST['input1Class'];

$input2_class = $_POST['input2Class'];

# do what you want with the variables

请注意，您必须在onSuccess函数内部处理服务器的响应。通常，人们使用 JSON 对来自服务器的响应进行建模。您可以使用 PHP 的内置函数json_encode和json_decode函数。例如，您的 PHP 脚本可以回答：

$input1_value = $_POST['input1Value'];

$input2_value = $_POST['input2Value'];

$input1_class = $_POST['input1Class'];

$input2_class = $_POST['input2Class'];

# do what you want to do with the variables, then

$response = array(

  'ok' => true,

  'message' => 'PHP says "Thanks" for the information'

);

header('Content-Type: application/json');

echo json_encode($response);

die;

在onSuccess函数内部，您将例如：

function onSuccess (response) {

  if (response.ok) {

    console.log('Submitted, and all values where OK');

    console.log(response.message);

    return; // opt-out early, no need for "else" keyword

  }

  console.log('Submitted, but something went wrong');

  console.log(response.message);

}