首页 > 解决方案 > 使用基于另一个输入字段的值将输入字段设为只读

问题描述

我在创建用户表单中有 3 个输入字段。根据状态的选择,我想将接下来的 2 个字段设置为具有特定值的只读字段。
因此,如果用户为 Status 选择“Full-Time”,接下来的 2 个字段应分别变为只读,值为 5 和 7.6。对于任何其他选择,它应保留为用户输入值的正常输入字段。我怎样才能做到这一点?非常感谢任何帮助 在此处输入图像描述

标签: c#asp.net-core-mvc

解决方案


您可以使用侦听器事件和 jquery 的方法 attr 来处理其他两个文本框的状态。这是一个例子。

function changeVal(e) {
            console.log(e.target.value)
            if (e.target.value == "Full Time") {
                $("#workingday").val(5)
                $("#workinghour").val(7.6)
                $("#workingday").attr("readonly", true)
                $("#workinghour").attr("readonly", true)
            } else {
                $("#workingday").val("")
                $("#workinghour").val("")
                $("#workingday").attr("readonly", false)
                $("#workinghour").attr("readonly", false)
            }
        }
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
<table>
    <tr>
        <td>status</td>
        <td>Working Day in weeks</td>
        <td>Working Hours Per Day</td>
    </tr>
    <tr>
        <td>
            <select onchange="changeVal(event)">
                <option value="">--select--</option>
                <option value="Full Time">Full Time</option>
                <option value="other">other value</option>
            </select>
        </td>
        <td>
            <input type="text" id="workingday" name="workingday" value="0" />
        </td>
        <td>
            <input type="text" id="workinghour" name="workinghour" value="0" />
        </td>
    </tr>
</table>


推荐阅读