单击保存按钮后的表单字段只读（查看）

Question

我想在用户在表单输入字段中填写 his/her 个人资料信息并在这些字段显示为（只读）后单击保存按钮后制作一些表单字段（只读）。

下面是我想要制作的表单字段。

<tr>
        <td class="widget-title"><font color="blue">Bank Details</font></td>
    </tr>
    <tr>
        <td>
                <table cellpadding="4" width="100%">
                <tr>
                    <td align="right" width="50%">
                    Bank Name:
                    </td>
                    <td><input type="text" name="bank" id="bank" value="{$user.bnk}"></td>
                </tr>
                <tr>
                <td align="right" width="50%">
                    Bank Account Number:
                    </td>
                    <td><input type="text" name="baccount" id="baccount" value="{$user.bnkact}"></td>
                </tr>
                <tr>
                <td align="right" width="50%">
                    Bank Account Title:
                    </td>
                    <td><input type="text" name="btitle" id="btitle" value="{$user.bnktit}"></td>
                </tr>
                <tr>
                    <td align="right" width="50%">
                    Bank Branch Code:
                    </td>
                    <td><input type="text" name="bcode" id="bcode" value="{$user.bnkcd}"></td>
                </tr>
                </table>
    </td>

Answer 1

提交数据的<input type="submit">/提交按钮在哪里？

将此按钮添加到您的代码中

<input type="submit" id="save" onClick="hide()" value="save">

然后在 <script></script> 标签内或按钮前包含的 .js 页面中添加一个 javascript 函数

根据给定的代码，这将是您的函数：

function hide(){
  document.getElementById("bank").disabled = true;
  document.getElementById("baccount").disabled = true;
  document.getElementById("btitle").disabled = true;
  document.getElementById("bcode").disabled = true;
}

所以完整的代码将在 html:

<input type="submit" id="save" onClick="hide()" value="save">

或

<input type="button" id="save" onClick="hide()" value="save">

并且在javascriptfunction hide(){ document.getElementById("bank").disabled = true; document.getElementById("baccount").disabled = true; document.getElementById("btitle").disabled = true; document.getElementById("bcode").disabled = true; }

单击保存按钮后的表单字段只读（查看）

Form fields after click the save button read only(view)

forms

readonly