Javascript 禁用复选框,直到显示文本

Javascript 禁用复选框,直到显示文本,javascript,Javascript,我有这个表单,它工作正常,但我需要tos2复选框被禁用,直到用户点击显示TOS。只有这样,用户才能选中复选框。 如果有人能给我一个提示,让它工作起来,那就太好了 提前谢谢 <?php ?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http

我有这个表单,它工作正常,但我需要tos2复选框被禁用,直到用户点击显示TOS。只有这样,用户才能选中复选框。 如果有人能给我一个提示,让它工作起来,那就太好了

提前谢谢

<?php

?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>

</title>
<link rel="stylesheet" href="css/style.css" type="text/css" media="screen"/>
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery.validate.js"></script>

<script type="text/javascript">
    $().ready(function() {
        $("#form1").validate();
    });        
</script>
<script type="text/javascript">
    $(document).ready(function() {
        $(".flip").click(function() {
            $(".panel").slideToggle("slow");
        });
    });
</script>
<script type="text/javascript">
$(document).ready(function($) {
      $("input[name$='enable']").click(function(){
               if ($(this).is(':checked')) {
                            var remove = '';
                            $('input.textbox:text').attr ('value', remove);
                            $('input.textbox:text').attr("disabled", true);
                            $('input.textbox:checkbox').attr("disabled", true);

                 }
               else if ($(this).not(':checked')) {
                            $('input.textbox:checkbox').attr("disabled", false);
                            $('input.textbox:text').attr("disabled", false);
                  }
 }); });

function showHide() {
    var ele = document.getElementById("showHideDiv");
    if(ele.style.display == "block") {
            ele.style.display = "none";
      }
    else {
        ele.style.display = "block";
    }
}

</script>

</head>
<body>

<div id="content" align="center">

  <div id="wrapper" style="width:550px !important;">

        <form method="post" action="inserting-process.php" id="form1" onsubmit="return validateForm()" class="signupform" name="signupform">
      <input type="hidden" name="allowlang" id="allowlang" value="no" />



      <table cellpadding="4" cellspacing="0" width="100%" border="0" style="text-align:left;">  
              <tr>
              <td><input type="checkbox" name="enable" id="enable" value="" style="width:15px !important"/>
                &nbsp;
                The package has not been received.</td>
                </tr>
        <tr>
          <td><input type="checkbox" name="2enable" id="3enable" value="SI" style="width:15px !important"/>
            &nbsp;
            There has been an issue.</td>

        </tr>

      </table>
    <br />


      <table cellpadding="4" cellspacing="0" width="100%" border="0" style="text-align:left;">

        <tr>
          <td width="120px"><strong>Name:</strong></td>
          <td><input type="text" name="fname" id="fname" class="textbox required" size="30"/></td>
        </tr>  

      </table>
      <br />  

            <h4 align="left" style="padding-left:5px; color:#d40000;">TOS
            </h4>

        <div id="showHideDiv" style="display:none;">

              <p align="left" style="padding-left:5px;">
              Some text here about terms of service Some text here about terms of service Some text here about terms of service Some text here about terms of service Some text here about terms of service Some text here about terms of service Some text here about terms of service Some text here about terms of service Some text here about terms of service Some text here about terms of service Some text here about terms of service Some text here about terms of service
              </p>
              <br />
        </div>

      <table cellpadding="4" cellspacing="0" width="100%" border="0" style="text-align:left;">

        <tr>
          <td><input type="checkbox" name="tos2" id="tos2" value="" style="width:15px !important"  class="textbox required" />
            &nbsp;
            I agree with the <a href="javascript: ;" onclick="return showHide();"> TOS.</a></td>
        </tr>

        <tr>
          <td height="50"></td>
          <td> <br /><button id="registerButton" type="submit" style="float:left;">Send Data</button></td>
        </tr>

      </table>

    </form>
  </div>
</div>
</body>
</html>

$().ready(函数()){
$(“#form1”).validate();
});        
$(文档).ready(函数(){
$(“.flip”)。单击(函数(){
$(“.panel”)。滑动切换(“慢速”);
});
});
$(文档).ready(函数($){
$(“输入[name$='enable']”)。单击(函数(){
如果($(this).is(':checked')){
var remove='';
$('input.textbox:text').attr('value',remove);
$('input.textbox:text').attr(“disabled”,true);
$('input.textbox:checkbox').attr(“disabled”,true);
}
else if($(this).not(':checked')){
$('input.textbox:checkbox').attr(“disabled”,false);
$('input.textbox:text').attr(“disabled”,false);
}
}); });
函数showHide(){
var ele=document.getElementById(“showHideDiv”);
如果(ele.style.display==“块”){
ele.style.display=“无”;
}
否则{
ele.style.display=“块”;
}
}
包裹尚未收到。
有一个问题。

名称:
托斯

这里有些文字关于服务条款这里有些文字关于服务条款这里有些文字关于服务条款这里有些文字关于服务条款这里有些文字关于服务条款这里有些文字关于服务条款这里有些文字关于服务条款这里有些文字关于服务条款这里有些文字关于服务条款这里有些文字关于服务条款这里有些文字关于服务条款这里的文字关于服务条款这里的文字关于服务条款这里的文字关于服务条款


我同意这个观点
发送数据
首先,将复选框设置为默认禁用:

<input type="checkbox" name="tos2" id="tos2" value="" style="width:15px !important"  class="textbox required" disabled="disabled" />
以下是所有工作:

现在,用户只能在打开TOS时选中此复选框


埃托伊斯

看到完美的作品,你是一个救生员。
function showHide() {
    var ele = document.getElementById("showHideDiv");
    if(ele.style.display == "block") {
            ele.style.display = "none";
      }
    else {
        ele.style.display = "block";
        document.getElementById("tos2").disabled = false ;
    }        
}