JavaScript的自动填充文本输入基于下拉选项(javascript auto fill tex

我有这个麻烦...希望能在从下拉列表中的用户名的选择自动填充文本输入框在我的形式。用户阵列来自一个MySQL数据库。不知道我的JavaScript正确写入。首先是我的数组，它只会得到从数据库为$用户调用。感谢您寻找。

<?php 
    $users=array
    (
        "User" => array 
        (
            "0" => array
                            (
                            "id" => "6",
                            "username" => "bsmith",
                            "full_name" => "Buddy Smith"
                            ),
            "1" => array
                            (
                            "id" => "2",
                            "username" => "lsmith",
                            "full_name" => "Libbie Smith"
                            ),
            "2" => array
                            (
                            "id" => "4",
                            "username" => "asmith",
                            "full_name" => "Andy Smith"
                            ) 
        )
    )
?>

随后的JavaScript：

<script type="text/javascript">
var ids = new Array();
var use = new Array();
var ful = new Array();
    <?php
        foreach($users as $key=>$value) {
            echo "ids[" . $key . "] = '" . $value['User']['id'] . "';\n";
            echo "use[" . $key . "] = '" . $value['User']['username'] . "';\n";
            echo "ful[" . $key . "] = '" . $value['User']['full_name'] . "';\n";
        }
        ?>

        function Choice() {
            x = document.getElementById("users");
            x.value = y.options[y.selectedIndex].text;
            document.getElementById("ids") = ids[y.selectedIndex];
            document.getElementById("use") = use[y.selectedIndex];
            document.getElementById("ful") = ful[y.selectedIndex];
           }

        }
</script>

然后我的html：

<form name="form1" method="post" action="">
<select name="users" onChange='Choice();'><option> </option>
<?php
foreach ($users as $key=>$value) {
echo '<option value="'.$key.'">'.$value['User']['username'].'</option>';
}
?>
</select>
<p><input type="text" id="ids" name="id" ></p>
<p><input type="text" id="ful" name="full_name" ></p>
</form>

Answer 1:

我花了一些自由，并没有真正理解PHP所以我做了那些部分。总之，这里是我的了：

http://jsfiddle.net/zunrk/

<html>
  <head>
    <style type="text/css">

    </style>
    <script type="text/javascript">
var ids = new Array();
var use = new Array();
var ful = new Array();

ids[0] = "";
use[0] = "";
ful[0] = "";

ids[1] = 6;
use[1] = "bsmith";
ful[1] = "Buddy Smith";

ids[2] = 2;
use[2] = "lsmith";
ful[2] = "Libbie Smith";

ids[3] = 4;
use[3] = "asmith";
ful[3] = "Andy Smith";


        function Choice() {
            //x = document.getElementById("users");
            y = document.getElementById("selectUsers");

              //x.value = y.options[y.selectedIndex].text;
              document.getElementById("ids").value = ids[y.selectedIndex];
              document.getElementById("use").value = use[y.selectedIndex];
              document.getElementById("ful").value = ful[y.selectedIndex];
         }


    </script>
  </head>
  <body>
<form name="form1" method="post" action="">
<select id="selectUsers" name="users" onChange='Choice();'><option> </option>
<option value="1">bsmith</option>
<option value="2">lsmith</option>
<option value="3">asmith</option>
</select>
<p>ids <input type="text" id="ids" name="id" ></p>
<p>use <input type="text" id="use" name="username" ></p>
<p>ful <input type="text" id="ful" name="full_name" ></p>
</form>
  </body>
</html>

Answer 2:

如果我理解正确你的问题，你需要设置你的输入文本字段的文本。您可以通过设置“值”字段这样做。

    function Choice() {
        x = document.getElementById("users");
        x.value = y.options[y.selectedIndex].text;
        document.getElementById("ids").value = ids[y.selectedIndex];
        document.getElementById("use").value = use[y.selectedIndex];
        document.getElementById("ful").value = ful[y.selectedIndex];
    }

文章来源: javascript auto fill text inputs based on drop down selection