javascript - 更改文本框 onchange 下拉列表的输入类

Question

我有一个问题，如何在下拉列表数据更改时更改复选框的输入类。

这是我的 html 标记:

           <p>
            <label for="ddlContType">
                Contact Type</label>
            <span>
                @Html.DropDownList("ddlContType", new SelectList(ViewBag.ContTypeList, "ID", "Display_Value",ContType), "[Please Select]",
            new Dictionary<string, object>
            {
                {"class","validate[required] inputLong"}
            })
            </span>
        </p>
        <p>
            <label for="txtContValue">
                Contact Value</label>
            <span>
                <input type="text" id="txtContValue" name="txtContValue" class="validate[required] inputLong"
                    value="" />`

因为我使用了jquery的validate

我的 DropDownList 中有电子邮件和电话号码

我想验证当我在下拉列表中选择电子邮件时，它将允许电子邮件格式文本框，并且当我在下拉列表中选择电话号码时......

它只允许电话格式这是我正在使用的类

class="validate[required,custom[email]]

和

class="validate[required,custom[phone]]

Answer 1

如果你想在下拉列表改变时改变一个类，那么只需为“change”事件添加一个监听器。处理程序应根据需要更新类:

$("#ddlContType").on("change", function(ddl) {
    var textEl = $("txtContValue");
    if ($(ddl).val() == "Email") {
        txtEl.attr("class", "validate[required,custom[email]]");
    } else {
        txtEl.attr("class", "validate[required,custom[phone]]");
    }
});