基于单选按钮检查值调用Javascript函数

Call Javascript Function Based on Radio Button Checked Value

本文关键字：Javascript 函数 值调用 检查 单选按钮      更新时间：2023-09-26

我有一个表单，它根据用户的帐户设置设置默认值（存储在MySQL DB中，并使用PHP提取）。当表格显示时，它会提取相关的账户信息并填充表格（名字、姓氏、电子邮件、账户类型等）

当用户的帐户类型为"admin"时，我希望表单的其余部分被禁用，并选择某些选项。如果用户的帐户类型为"admin"，因此默认选中"edit_type_admin"单选按钮（见下文），我希望在加载页面时调用下面的makeEditDisable（）函数（无需任何单击）。

现在表单显示帐户类型如下：

Client or Admin: <br />
Client <input type="radio" name="edit_type" id="edit_type_client" value="client" <? if($selected_type == 'client') { echo 'checked'; } ?> onclick="makeEditEnable()" />
Admin <input type="radio" name="edit_type" id="edit_type_admin" value="admin" <? if($selected_type == 'admin') { echo 'checked'; } ?> onclick="makeEditDisable()" />

在两个选项之间切换时，onclick makeEditEnable（）/makeEditDisable（）函数可以正常工作：

<script type="text/javascript">
          function makeEditDisable(){
              var x=document.getElementById("edit_access_begin")
              x.disabled=true;
              var x=document.getElementById("edit_access_expire")
              x.disabled=true;
              var x=document.getElementById("edit_project_access_yes")
              x.checked=true;
              var x=document.getElementById("edit_project_access_yes")
              x.disabled=true;
              var x=document.getElementById("edit_project_access_no")
              x.disabled=true
          }
         function makeEditEnable(){
            var x=document.getElementById("edit_access_begin")
            x.disabled=false;
            var x=document.getElementById("edit_access_expire")
            x.disabled=false;
            var x=document.getElementById("edit_project_access_yes")
            x.disabled=false;
            var x=document.getElementById("edit_project_access_no")
            x.disabled=false
         }</script>

将其添加到脚本或函数中，该脚本或函数在元素加载后加载，当然也在makeEditDisable()加载后加载：

<? if($selected_type == 'admin') { echo 'makeEditDisable();'; } ?>

这应该调用您的函数。

您可以使用类似@Jeffmananswer的PHP向页面添加函数调用。但请确保在脚本本身之后添加类似的内容，否则它将在客户端上的undefined function错误中生成。

或者您可以在页面onload或onDOMReady事件中调用它。

我还想建议对你的脚本进行清理http://jsfiddle.net/DHxvk/

var editableFields = ['edit_access_begin','edit_access_expire','edit_project_access_yes','edit_project_access_no'];
function makeEditDisable(){
    for(var i=0; i<editableFields.length; i++)
        document.getElementById(editableFields[i]).disabled=true;
}
function makeEditEnable(){
    for(var i=0; i<editableFields.length; i++)
        document.getElementById(editableFields[i]).disabled=false;
}
相关文章：