Javascript 如何根据Django中下拉菜单的选择显示和隐藏表单字段

我有一个关于如何根据Django中父字段的选择条件隐藏或显示字段的问题

**更新：我可以通过在JavaScript中定义一个函数来实现这个特性，这个函数已经用一些简单的HTML代码进行了测试。然而，由于我的输入表是由Django创建的，有人能告诉我如何在Django'onchange'中调用这个函数吗**

最后一个更新：我认为使用jQuery更容易做到这一点。

Javascript: 说明： 1.在做出任何选择之前，只能看到一个下拉菜单“应用方法” 2.如果从父框中选择“空中喷洒”，则会出现一个新的下拉菜单“空中尺寸距离” 3.如果从父框中选择“地面喷洒”，则需要输入另一个下拉列表“地面喷洒类型”

<script type="text/javascript">
function display(obj,id1,id2) {
txt = obj.options[obj.selectedIndex].value;
document.getElementById(id1).style.display = 'none';
document.getElementById(id2).style.display = 'none';

if ( txt.match(id1) ) {document.getElementById(id1).style.display = 'block';}
if ( txt.match(id2) ) {document.getElementById(id2).style.display = 'block';}
</script>

<table>
<tbody align="center">
<tr><th>Application method:</th>
<td><select onchange="display(this,'A','B')" name="method" id="id_method">
<option value="">Pick a method</option>
<option value="A">Aerial Spray</option>
<option value="B">Ground Spray</option>
</select></td></tr></tbody>

<tbody id="A" align="center" style="display: none;">
<tr><th><label for="id_aerial_size_dist">Aerial Size Dist:</label></th><td><select select name="aerial_size_dist" id="id_aerial_size_dist">
<option value="" selected="selected">Pick first</option>
<option value="A1">Very Fine to Fine</option>
<option value="A2">Fine to Medium (EFED Default)</option>
</select></td></tr>
</tr>
</tbody>

<tbody id="B" align="center" style="display: none;">
<tr><th><label for="id_spray_type">Ground spray type:</label></th><td><select name="spray_type" id="id_spray_type">
<option value="B1" selected="selected">Low Boom Ground Sprayer (20 Inches or Less)</option>
<option value="B2">High Boom Ground Sprayer (20 to 50 Inches: EFED Default)</option>
</select></td></tr></tbody></table>

---

您需要一些自定义javascript来隐藏或取消隐藏相应的字段。这个小部件中有javascript吗？

我想我得到的唯一javascript是“onchange”内容。那个么我应该看看Django媒体课吗？我并没有正确阅读。您可以通过设置onchange来完成您正在做的事情，但我认为这不是有效的javascript。例如，在实际呈现的HTML中，大小字段可能显示为id_size。我已经使用媒体类将javascript作为单独的javascript文件进行了编写。你可以按自己的方式来做，但要确保你的javascript是正确的。我可以通过使用javascript定义一个函数来实现这个功能，但是你知道如何以Django形式调用这个函数吗？请看更新后的帖子。越来越近，仍然有很多问题。1.在python代码中，有“display（this，'A'，'B'，'C'，'D'）；”。A/B/C/D最终被取消报价。你可以考虑“显示”，“a”，“b”，“c”，“d”）。最后，找到一种实现此功能的方法。widget=forms.Select（attrs={'onchange'：mark_safe（“display（this，'A'，'B'，'C'，'D'）；”）））然而，jQuery似乎是一个更好的解决方案。这是一个JavaScript的东西。仔细看看jQuery@icn，我是一个编程新手…你能给我举一个这种应用的例子吗？谢谢！

class GENEECInp(forms.Form):
    application_method = forms.ChoiceField(required=True, choices=applicationmethod_CHOICES, initial='Aerial Spray',
                                           widget=forms.Select(attrs={'onchange':mark_safe("display(this,'A','B','C','D');")})