1

再见

我需要根据用户选择创建一个动态表单。

即在我选择的第一个表单字段中"John Smith"，这将填充（通过外部 php/mysql 文件）第二个选择字段"Artist, Carpenter, Other"，如果我选择艺术家，我将填充第三个选择字段，"Singer, Painter, Sculptor"依此类推

由于我对 javascript 的无能，我花了一上午的时间在谷歌上搜索脚本，我在这里找到了一个很酷的教程

它可以工作，很干净，但它只更新带有 id 的 div txtResult，它静态包含在 js 文件中（参见 ajax_req.js 的第 19 和 31 行）。我以为我可以通过 GET 传递 id 名称，但我不知道如何让脚本识别变量。

这是代码：

function stateChanged()  
{  
   if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete")  
   {  
           document.getElementById("txtResult").innerHTML= xmlHttp.responseText;  
   }  

}

我想通过 GET id 名称传递并有这样的东西：

function stateChanged()  
{  
   if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete")  
   {  
           document.getElementById("GET[idName]").innerHTML= xmlHttp.responseText;  
   }  

}

你能帮我么？如果您碰巧知道更好的东西，我也可以更改脚本

Ciao，谢谢你，

埃德

4

2 回答 2

1

这是HTML ... 

    <!doctype html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <script type="text/javascript" src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
        <script type="text/javascript">
        $(function(){
            $.get('x.php?f_name=get_names',function(data){
                $("#select_name").html(data);
                $.get("x.php?f_name=get_jobs&s_name="+$("#select_name").val(),function(data){
                    $("#select_job").show();
                    $("#select_job").html(data);
                })
            });


            $("#select_name").change(function(){
                $.get("x.php?f_name=get_jobs&s_name="+$("#select_name").val(),function(data){
                    $("#select_job").html(data);
                })

            });





        })

        </script>
    </head>
    <body>
        <select name="name" id="select_name">

        </select>

        <select name="job" id="select_job"></select>
    </body>
    </html>

, 而这是 PHP 端（代码中称为 x.php）

    <?php
        $names = array("A","B","C");
        $jobs  = array(array("Job_1","Job_2") ,array("Job_1"), array("Job_1","Job_2","Job_3"));
        GLOBAL $names;
        GLOBAL $jobs;


        switch ($_GET['f_name']) {
            case 'get_names':
                get_names($names);
                break;
            case 'get_jobs':
                get_jobs($jobs,$_GET['s_name']);
                break;
            default:
                # code...
                break;
        }





        function get_names($names){
            foreach ($names as $key=>$value) {
                echo "<option value='$key'>$value</option>";
            }
            return false;
        }
        function get_jobs($jobs,$s_name){
            foreach ($jobs[$s_name] as $key => $value) {
                echo "<option value='$key'>$value</option>";
            }
            return false;
        }



    ?>

您可以创建自己的数组，例如 $names 和 $jobs，并添加一些 case 来切换以获得更复杂的系统...

祝你今天过得愉快。

于 2013-09-30T10:33:58.527 回答
0

在您的select通行证 ID 中element，

<select name="country" onchange="htmlData('city.php', 'ch='+this.value, 'your_element_id')" />

在htmlData()

function htmlData(url, qStr, id) { // get id as well that is 'your_element_id'

   //You can do line 43 in `ajax_req.js` as,

   xmlHttp.onreadystatechange = function () {
                                    stateChanged(id);
                                }
}

在stateChanged()

function stateChanged(id)  
{  
   if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete")  
   {  
           document.getElementById(id).innerHTML= xmlHttp.responseText;  
   }  
   else {  
           //alert(xmlHttp.status);  
   }  
}

然后你可以在第 31 行做，

document.getElementById(id).innerHTML="";
于 2013-09-30T10:19:20.540 回答