Javascript 可以动态创建HTMLHelper吗？

我想根据下拉列表的值创建一个htmlhelpers元素。代码如下：

下拉列表

<select id="pracownicy">

        <option value="biurowy" style="color: black">Pracownik biurowy</option>
        <option value="przewodnik" style="color: black">Przewodnik</option>
    </select>

剧本应该是这样的：

 <script>
        function pracownicy() {
            var x = document.getElementById("pracownicy");

            if (x.value.equalTo("biurowy"))
            {



            }

            if (x.value.equalTo("przewodnik")) {

            }
        }


    </script>

在这些脚本中，我想动态创建如下内容：

对于biurowy值：

 <div class="form-group">

            @Html.LabelFor(model => model.Pracownik_biurowy.Nazwa_uzytkownika, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.EditorFor(model => model.Pracownik_biurowy.Nazwa_uzytkownika, new { htmlAttributes = new { @class = "form-control" } })
                @Html.ValidationMessageFor(model => model.Pracownik_biurowy, "", new { @class = "text-danger" })
            </div>
        </div>

对于przewodnik值：

  <div class="form-group">
            @Html.LabelFor(model => model.Przewodnik.Uprawnienia, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.EditorFor(model => model.Przewodnik.Uprawnienia, new { htmlAttributes = new { @class = "form-control" } })
                @Html.ValidationMessageFor(model => model.Przewodnik.Uprawnienia, "", new { @class = "text-danger" })
            </div>
        </div>

如何做到这一点？

就是一个有效的例子

function handleChange(){

    var strg="";
    $( "select option:selected" ).each(function(){
        strg = strg + this.value;
    });

    if (strg =="biurowy"){
        alert('adding1');
        $('#cont').append('<p>yourForm1</p>');
    } 

    if (strg =="przewodnik"){
                alert('adding2');
        $('#cont').append('<p>yourForm2</p>');
    } 


}

$('#pracownicy').change(handleChange);

您需要用表单代码替换yourFormX

请注意，我稍微更改了下拉代码，如下所示：

<select id="pracownicy">
    <option value="unselected" style="color: black">Not Selected</option>
    <option value="biurowy" style="color: black">Pracownik biurowy</option>
    <option value="przewodnik" style="color: black">Przewodnik</option>
</select>

---

谢谢，这很有效！但是，您能帮助我如何避免这些表单的重复，以及如何使每个表单可以一次显示吗？如果您要始终显示其中一个表单，则可以从下拉列表中删除未选择的选项。让我们假设列表中的第一项是biurowy。默认情况下，您可以在cont部分添加相关表单。当用户从下拉列表中选择其他选项时，该表单将替换为另一个表单。若用户返回第一个选项，内容将再次替换为第一个表单。这对你有意义吗？=]是的，但是我如何替换这个表单呢？您可以使用$'cont'.html'your form来代替$'cont'.append。