如何使HTML表单输入变灰？

Question

在HTML表单上灰显文本输入的最佳方法是什么？当用户选中复选框时,我需要输入变灰.我是否必须使用JavaScript(不熟悉JavaScript)或者我可以使用PHP(我更熟悉)？

编辑:

经过一些阅读后,我得到了一些代码,但它给了我一些问题.由于某种原因,我无法根据表单输入的状态(启用或禁用)或复选框的状态(选中或取消选中)使我的脚本工作,但我的脚本在我基于表单的值时工作正常投入.我编写的代码完全像在线的几个例子(主要是这个),但无济于事.没有被注释掉的东西都可以使用.我在这做错了什么？

<label>Mailing address same as residental address</label>
<input name="checkbox" onclick="disable_enable()" type="checkbox" style="width:15px"/><br/><br/>

<script type="text/javascript">

    function disable_enable(){

        if (document.form.mail_street_address.value==1)
            document.form.mail_street_address.value=0;
            //document.form.mail_street_address.disabled=true;
            //document.form.mail_city.disabled=true;
            //document.form.mail_state.disabled=true;
            //document.form.mail_zip.disabled=true;

        else
            document.form.mail_street_address.value=1;
            //document.form.mail_street.disabled=false;
            //document.form.mail_city.disabled=false;
            //document.form.mail_state.disabled=false;
            //document.form.mail_zip.disabled=false;

    }

</script>

编辑:

这是一些基于@ Chief17建议的更新代码.最好的我可以告诉这一切都没有用.我用它value作为测试,因为它的工作原因是出于某种原因

            <label>Mailing address same as residental address</label>
        <input name="checkbox" onclick="disable_enable()" type="checkbox" style="width:15px"/><br/><br/>

        <script type="text/javascript">

            function disable_enable(){

                if (document.getElementById("mail_street_address").getAttribute("disabled")=="disabled")
                    document.form.mail_street_address.value=0;
                    //document.getElementById("mail_street_address").removeAttribute("disabled");
                    //document.getElementById("mail_city").removeAttribute("disabled");
                    //document.getElementById("mail_state").removeAttribute("disabled");
                    //document.getElementById("mail_zip").removeAttribute("disabled");

                else
                    document.form.mail_street_address.value=1;
                    //document.getElementById("mail_street_address").setAttribute("disabled","disabled");
                    //document.getElementById("mail_city").setAttribute("disabled","disabled");
                    //document.getElementById("mail_state").setAttribute("disabled","disabled");
                    //document.getElementById("mail_zip").setAttribute("disabled","disabled");
            }

        </script>

Answer 1

不幸的是,由于您是在响应用户输入而没有将表单发送回服务器的情况下执行此操作,因此您必须通过JavaScript执行此操作.

JavaScript中的输入元素具有readonly和disabled属性.如果您希望它们完全禁用,则需要使用JavaScript(或类似jQuery的库)将disabled属性的值更改为"disabled".

请注意,在提交表单时,禁用的输入不会将其值发送到服务器.