Question

我有一个<select>框。

用户必须选择一个选项才能继续。

然后，<select>框应该消失（select.onchange(html.(display:hidden;))，类似这样的内容，对吧？！）并且<option>必须通过ajax发送到另一个文件或 - 相同。

<select name="var" id="var">
  <option value="a">A</option>
  <option value="b">b</option>
</select>

接下来，它将执行一个查询（基于之前的选择）并在div中构建一个表单组合（可能是一个或多个）供用户选择：

<div>
  <p>Some info</p>
<form>
  <inputs>
  <inputs>
  <inputs>
</form>
</div>

我对javascript并不多，而且我对函数（load()，getJSON()等）感到有些迷茫。

为此目的最好的是什么？

我正在尝试getJSON() *，但我在语法，调试和操作变量，请求等方面遇到了问题。

所有PHP代码都正常运行。我只想添加平滑度，减少刷新，为用户提供便利，具有安全性和性能。

*似乎getJSON不适合此

Answer 1

您可以使用onchange Javascript事件：https://developer.mozilla.org/en-US/docs/Web/API/GlobalEventHandlers/onchange

var selectField = document.getElementById('selectField');
selectField.onchange = function()
{
    //Select Value
    var value = selectField[selectField.selectedIndex].value;
    //Hides the field
    selectField.style.display = "none";
    //Display the value
    document.getElementById("container").innerHTML = value;
}

HTML -

<div id="container">
 <select id="selectField" >
  <option value ="a">A</option>
  <option value ="b">B</option>
 </select>
</div>

在线演示：https://jsfiddle.net/acqwwbfb/2/ 这只是为了让你开始。

Answer 2

当您标记jquery时，您可以使用.on('change')并创建需要使用的表单数组..像这样

在Js

$(document).ready(function(){    
  $('select#var').on('change',function(){
    var getValue = $(this).val();
    $.ajax({
       url : 'yourUrl.php',
       type : 'post',
       data : {value : getvalue},
       success : function (data){
          alert(data);
          /*if(data !== 0){
             $('#show_forms').html(data);
          }*/
       },
       error : function(){
         alert('error please check the url');
       }
    });
  }).change();
});

你用js与

链接的index.php文件

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select name="var" id="var">
  <option value="a">A</option>
  <option value="b">b</option>
</select>

<div id="show_forms"></div>

yourUrl.php文件，您将检查

中的数据库

<?php 
  echo $_POST['value'];
?>

在此代码之后，您应该使用选择值

获得警报

根据用户选择显示表单 - ajax

2 个答案: