jQuery的复选框中的问题被禁用按钮 [英] jQuery disabled button with checkbox issue

问题描述

我有以下的code这使得当复选框被选中的按钮。

http://jsfiddle.net/ERfWz/1/

以下是从code我有我的HTML页面片段。这是很多但是由于某种原因，它不工作一样。我想我可能一直在寻找太久。

 ＆LT;脚本类型=文/ JavaScript的'＆GT;
$（函数（）{
  $（'＃同意）。点击（函数（）{
    。VAR满足= $（'＃同意：检查）VAL（）;
    如果（满意=未定义！）$（'＃提交）removeAttr（禁用）。
    否则$（'＃提交）ATTR（禁用，禁用）。
  }）;
}）;
＆LT; / SCRIPT＆GT;＆LT;形式为GT;
    ＆LT;表＆gt;
    ＆LT; TD合并单元格=5＆GT;＆LT;输入类型=复选框ID =同意NAME =同意/ I标记已阅读并同意条款和    条件＆LT; / TD＆GT;
                  ＆LT; / TR＆GT;
                  ＆所述; TR＆GT;
                    ＆LT; TD合并单元格=5ALIGN =中心＆GT;＆LT;输入名称=提交类型=提交ID =提交残疾值=我接受。    提交/＆GT;
                  ＆LT;标签＆gt;
                      ＆LT;输入名称=复位TYPE =重置ID =复位值=重置/＆GT;
                      ＆LT;输入类型=隐藏的名字=IP值=回声$ REMOTE_ADDR;/＆GT;
                  ＆LT; /标签＆gt;＆LT; / TD＆GT;
                  ＆LT; / TR＆GT;
                    ＆所述; TR＆GT;
                    ＆LT; TD＆GT; *必须填写＆LT; / TD＆GT;
                    ＆LT; TD合并单元格=4＆GT;＆LT; / TD＆GT;
                  ＆LT; / TR＆GT;
                   ＆所述; TR＆GT;
                    ＆LT; TD合并单元格=5＆GT;＆LT; H3＆GT;＆LT; / H3 GT＆;
                     ＆所述p为H.;＆放大器; NBSP;＆下; / P＆GT;＆下; / TD＆GT;
                  ＆LT; / TR＆GT;
                ＆LT; /表＆gt;
            ＆LT; /字段集＆GT;
            ＆LT; /表及GT;
 

解决方案

您还可以设置禁用与真正和假，所以您可以简化它归结为：

  $（函数（）{
  $（'＃同意）。改变（函数（）{
    $（'＃提交）ATTR（禁用，this.checked！）。
  }）;
}）;
 

测试一下这里，注意，以前也有一些无效的标记回事致使一些跨浏览器的不一致，就应该是这个样子：

 ＆LT;形式为GT;
  ＆LT;表＆gt;
    ＆LT; TR＆GT;＆LT; TD ALIGN =中心＆GT;＆LT;输入类型=复选框NAME =同意ID =同意＆GT;我同意条款和条件与LT; / TD＆GT;＆LT; / TR＆GT;
    ＆LT; TR＆GT;＆LT; TD ALIGN =中心＆GT;＆LT;输入类型=提交名称=提交ID =提交值=提交残疾＆GT;＆LT; / TD＆GT;＆LT; / TR＆GT;
  ＆LT; /表＆gt;
＆LT; /表及GT;
 

另外， .change（） 方法是一个好一点这里，以确保你有正确的状态。

I have the following code which enables a button when the checkbox is checked.

http://jsfiddle.net/ERfWz/1/

The following is a snippet from the code I have in my HTML page. It's much the same however for some reason it's not working. I think I may have been looking at it for too long.

<script type='text/javascript'>
$(function() {
  $('#agree').click(function() {
    var satisfied = $('#agree:checked').val();
    if (satisfied != undefined) $('#submit').removeAttr('disabled');
    else $('#submit').attr('disabled', 'disabled');
  });
});​
</script>



<form>
    <table>
    <td colspan="5"><input type="checkbox" id="agree" name="agree" />I have read and agree to the terms and 

    conditions</td>
                  </tr>
                  <tr>
                    <td colspan="5" align="center"><input name="Submit" type="submit" id="submit" disabled value="I Accept. 

    Submit"/>
                  <label>
                      <input name="reset" type="reset" id="reset" value="Reset" />
                      <input type="hidden" name="ip" value=" echo $REMOTE_ADDR; " />
                  </label></td>
                  </tr>
                    <tr>
                    <td>*Required Fields</td>
                    <td colspan="4"></td>
                  </tr>
                   <tr>
                    <td colspan="5"><h3></h3>
                     <p>&nbsp;</p></td>
                  </tr>
                </table>
            </fieldset>
            </form>

解决方案

You can also set disabled with true and false, so you can simplify it down to:

$(function() {
  $('#agree').change(function() {
    $('#submit').attr('disabled', !this.checked);
  });
});​

Test it out here, note there was also some invalid markup going on resulting in some cross-browser inconsistencies, it should look something like this:

<form>
  <table>
    <tr><td align="center"><input type="checkbox" name="agree" id="agree">I agree Terms and Conditions</td></tr>
    <tr><td align="center"><input type="submit" name="submit" id="submit" value="submit" disabled></td></tr>
  </table>
</form>

Also the .change() method's a bit better here, to ensure you have the correct state.

这篇关于jQuery的复选框中的问题被禁用按钮的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！