Question

我有一个Web应用程序，用户可以在其中更改某些事件的描述，以供在游客Android应用程序中使用。

到目前为止，该表单具有2个字段，一个选择类型的字段，其中包含数据库中的所有事件，还有一个文本字段，用户可在其中编写新的描述。

现在，尽管足够了，但当应用程序完成并发布给公众时，数据库将包含数百个事件。因此，我想到要做到这一点，所以有了第三个字段“ PLACE”。一旦选择了地点，事件的选择形式将发生变化，仅显示与该地点相关的事件（例如：植物园将仅显示中世纪集市的数据，而不是例如《哈姆雷特》的表演）。

¿JS可以做到吗？

这是我正在使用的代码：

<html>
   <head>
   <link rel="stylesheet" href="style_form.css">

   <script type="text/javascript">
       //auto expand textarea
       function adjust_textarea(h) {
           h.style.height = "20px";
           h.style.height = (h.scrollHeight)+"px";
       }
   </script>
</head>

   <body>

       ENTRE
   <form class="form-style-4" action="update.php" method="post">
       <br>
   <label for="id"><span>Elija un evento a cambiar</span>
   <br>
     <select name="id">

         <?php

           $server = I;
           $usuario = WONT;
           $pass = SHOW;
           $database= THIS;

           $mysqli = new mysqli($server, $usuario, $pass, $database);

           $query = $mysqli -> query ("SELECT * FROM INFORMACION_EVENTOS");

           while ($valores = mysqli_fetch_array($query)) {
               echo '<option value="'.$valores[id].'">'.$valores[titulo].'</option>';
           }

       ?>
     </select>
     <br>
     </label>
     <label for="descripcion">
     <span>Descripcion</span>
     <br>
     <textarea name="descripcion" onkeyup="adjust_textarea(this)" required="true" placeholder="Max 50 caracteres"></textarea>

     </label>
     <input type="submit" value="Submit">
   </form>
   </body>
</html>

Answer 1

是的。那是浏览器中Javascript的主要目的之一-操作文档对象模型（DOM）。有两种解决方法：您可以将数据构建到Javascript中，也许在交付页面时在服务器端动态生成Javascript的全部或一部分，从而构建您想要的各种选项的对象或数组并将它们包含在发送给浏览器的Javascript中。随着数据量的增加，这种方式变得麻烦而笨拙。

另一种选择是使用AJAX和服务器API，以允许页面在选择更改时请求选项。这是大多数网站的管理方式，但是可能需要做更多的工作，因为它需要服务器和客户端上的代码，并具有定义的交互API。

关于物理操作<select>元素中的值，您可以自己编写类似于this StackOverflow answer的内容，也可以使用jQuery或Angular等DOM库。

有没有一种方法可以动态更改HTML中的选择表单？

1 个答案: