javascript - 如何从 FORM 中获取选项 VALUE 而无需在 php 中提交？

Question

这是代码。

<form method="POST"  onChange="getHouseModel()">
  <select name="house_model" id="house_model">
    <option value="">------</option>
    <option value="<?php echo $model1;?>">Model 1</option>
    <option value="<?php echo $model2;?>">Model 2</option>
    <option value="<?php echo $model3;?>">Model 3</option>
  </select>
</form>

<script type='text/javascript'>
   function getHouseModel(){
      var model=$('#house_model').val();
      alert(model);
}
</script>

现在我想在 php 中显示模型变量的值。我该怎么做？

Answer 1

您可以使用例如 jQuery 和 ajax 调用，例如:

<script src="https://code.jquery.com/jquery-2.2.3.min.js"></script>

<form method="POST"  onChange="getHouseModel()">
  <select name="house_model" id="house_model">
    <option value="">------</option>
    <option value="<?php echo $model1;?>">Model 1</option>
    <option value="<?php echo $model2;?>">Model 2</option>
    <option value="<?php echo $model3;?>">Model 3</option>
  </select>
</form>

<script>
$('#house_model').on('change', function() {
    $.ajax({
        url: 'test.php', 
        data: { house_model: $('#house_model').val() }, 
        cache: false, 
        success: function(data) {
            console.log(data)
        }
    });
});
</script>

测试.php

<?php
var_dump($_REQUEST);
?>

首先，我们将 chnage 事件绑定(bind)到选择字段，然后使用选择的值对 PHP 文件 (test.php) 进行 ajax 调用。

如果您只需要选择，您可以删除它周围的表单，这对于 ajax 调用来说是不需要的;)