如何使用复选框启用禁用的图像提交按钮？

//复选框的一部分

<input type="checkbox" style="margin-right:3px">I confirm that the details on this form are correct.

//提交按钮

<input type="image" src="images/submit-btn.png" border="0" >

现在我的问题是，如何启用禁用提交按钮使用复选框，通过jQuery的？

来源

2012-01-28 sasori

从我可以看到你的提交按钮实际上并没有做任何事情，我想你对分配一个click处理程序锚标签？ – 2012-01-28 14:20:48

这里是演示检查[它]（http://jsfiddle.net/KK2aV/19/） – sathishkumar 2012-01-28 14:34:47

试试这个

$(':checkbox').change(function(){ 
    $('input[type="image"]').attr("disabled", !$(this).attr('checked')); 
}); 

$('input[type="image"]').click(function(){ 
alert("123"); 
});

编辑：

<input type="image" src="images/submit-btn.png" border="0" disabled="disabled"/>

小提琴例如：http://jsfiddle.net/hKAE5/

来源

2012-01-28 14:18:10

嗨，我将它改为，那是怎么回事？ – sasori 2012-01-28 14:23:09

更新了答案.. – 2012-01-28 14:25:14

如果我们假设提交按钮被禁用，并且复选框的勾号应该启用它..请更新您的答案，谢谢 – sasori 2012-01-28 14:33:22

由于您提交按钮是一个链接（并非真正的提交按钮）我想你正在使用JavaScript来处理链接上的点击事件。如果你想禁用提交，你应该提供处理点击这个链接的方式，或者你应该使用提交按钮来代替。使用提交按钮时，您可以设置禁用属性以禁用它。

来源

2012-01-28 14:19:59 Roel

你可能会提出错误的问题。上面的提交按钮其实不是图像提交按钮。

图片提交按钮是

<INPUT TYPE="image" SRC="images/submit-btn.png" id="submit_id" />

如果你想运行代码时复选框（带ID checkbox_id）被选中使用下面的代码片段：

$('#checkbox_id').change(function() { 
if ($(this).is(':checked')) 
    $("#submit_id").attr("disabled", "disabled"); 
});

编辑： 如果你想提交按钮默认情况下禁用您需要：

<INPUT TYPE="image" SRC="images/submit-btn.png" id="submit_id" disabled="disabled" />

然后你只需要改变上面的代码中，所以当用户复选框点击，按钮将被激活：

 $('#checkbox_id').change(function() { 
     if ($(this).is(':checked')) { 
      // DISABLE 
      $("#submit_id").attr("disabled", "disabled"); 
     } else { 
      // ENABLE    
      $("#submit_id").removeAttr("disabled"); 
     } 
    });

来源

2012-01-28 14:21:13

我更新了我的问题...如何使默认情况下禁用按钮，并通过使用jquery，如何启用它勾选复选框？..请更新您的答案，谢谢 – sasori 2012-01-28 14:34:29

这里是与您现有的标记工作的例子。您可以测试此：http://jsfiddle.net/brentmn/yPmSV/

HTML：

<input type="checkbox" style="margin-right:3px">I confirm that the details on this form are correct. 

<a class="submit disabled" href="#"><img src="images/submit-btn.png" border="0" ></a>

JS：

$(function() { 
    var $check = $(':checkbox'); 
    var $submit = $('.submit'); 

    $submit.on('.click', function() { 
     return $check.is(':checked'); 
    }); 

    $check.on('click', configureSubmit); 

    function configureSubmit() { 
     if ($check.is(':checked')) { 
      $submit.removeClass('disabled'); 
     } else { 
      $submit.addClass('disabled'); 
     } 
    } 

    configureSubmit(); 
});

来源

2012-01-28 14:41:48

如何使用复选框启用禁用的图像提交按钮？

回答

相关问题