【问题标题】:Call Javascript Function Based on Radio Button Checked Value根据单选按钮检查值调用 Javascript 函数
【发布时间】:2013-09-07 04:34:27
【问题描述】:

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

当用户的帐户类型为“管理员”时,我希望禁用表单的其余部分,并选择某些选项。如果用户的帐户类型是“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>

【问题讨论】:

  • 完整答案是以下答案的组合。我首先按照@Vitim.us 的建议清理了 javascript 代码。然后我添加了if($selected_type == 'admin') { echo "&lt;script type='text/javascript'&gt;window.onload=makeEditDisable;&lt;/script&gt;"; },就像@Jeffman 建议的那样。唯一的区别是我使用的window.onload=makeEditDisable,以便在页面加载后调用该函数,我在这里找到:[mkyong.com/javascript/javascript-call-funtion-after-page-load/]

标签: php javascript


【解决方案1】:

您可以使用 PHP 向您的页面添加函数调用,例如 @Jeffman 答案。 但请确保将其添加为 脚本本身,否则它将在客户端上生成 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;
}

【讨论】:

  • 感谢您稍微清理一下。我对 Javascript 的了解足以让事情发挥作用——但它们并不总是最佳的。
【解决方案2】:

将此添加到在元素加载后加载的脚本或函数中,当然在 makeEditDisable() 加载之后:

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

这应该调用你的函数。

【讨论】:

  • 我不得不将我的 PHP 变量移到页面上的 标记之前,这样我就可以做类似$body = '&lt;body&gt;';if($selected_type == 'admin') { $body = "&lt;body onLoad='makeEditDisable()'&gt;"; } 谢谢!!
  • 不,我撒谎了——不需要移动。我只需要在声明 PHP 变量 $selected_type 之后和需要禁用的表单元素之前添加if($selected_type == 'admin') { echo "&lt;script type='text/javascript'&gt;makeEditDisable();&lt;/script&gt;"; }。再次感谢,这工作得很好。
猜你喜欢
  • 2019-09-16
  • 1970-01-01
  • 1970-01-01
  • 2016-05-08
  • 2013-10-29
  • 2016-12-10
  • 2011-07-10
  • 2012-12-07
  • 2013-03-19
相关资源
最近更新 更多