iCheck Enable/Disable Input-File(bootstrap) 当我选中复选框时的按钮

Question

你好我正在使用 iCheck(http://icheck.fronteed.com/) 问题是，当我单击复选框时，输入文件按钮有效但看起来是 "disabled" 但它仍然是灰色，而不是绿色。

我正在使用两个事件，ifChecked/ifUnchecked。

我之前试过attr、removeclass、addclass，用的不是.prop()；

<input id="Archivo" name="Archivo" type="file" accept=".pdf,.doc" disabled />

 $("#Archivo").fileinput({
    language: "es",
    browseClass: "btn btn-primary",
    showCaption: true,
    showRemove: false,
    showUpload: false,
    browseLabel: "&nbsp;Buscar",
    allowedFileExtensions: ["pdf", "doc"],
    elErrorContainer: "#divErrorImagen",
    maxFileSize: 122880
}); 


$('input').on('ifChecked', function (event) {
    console.log("Checked OK")
   $('#Archivo').prop("disabled", false);


});
$('input').on('ifUnchecked', function (event) {
    console.log("Unchecked OK")
   $('#Archivo').prop("disabled", true);

});

Answer 1

$('input[type=checkbox]').change(function() {
  if ($("#ifChecked").prop('checked')) {
    console.log("Checked OK")
    $('#Archivo').prop("disabled", false);
  } else {
    $('#Archivo').prop("disabled", true);
  }
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input id="Archivo" name="Archivo" type="file" accept=".pdf,.doc" disabled />
<input type="checkbox" name="ifChecked" id="ifChecked"> I ifChecked<br>

Answer 2

尝试使用文件输入插件 disable and enable 方法

$(document).ready(function() {
  $("#Archivo").fileinput({
    language: "es",
    browseClass: "btn btn-primary",
    showCaption: true,
    showRemove: false,
    showUpload: false,
    browseLabel: "&nbsp;Buscar",
    allowedFileExtensions: ["pdf", "doc"],
    elErrorContainer: "#divErrorImagen",
    maxFileSize: 122880
  });

  $('#checkbox').iCheck({
    checkboxClass: 'icheckbox_minimal',
    radioClass: 'iradio_minimal',
    increaseArea: '20%'
  });

  $('input').on('ifChecked', function(event) {
    console.log("Checked OK")
    $('#Archivo').fileinput('disable');
  });

  $('input').on('ifUnchecked', function(event) {
    console.log("Unchecked OK")
    $('#Archivo').fileinput('enable');
  });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/iCheck/1.0.2/skins/all.css" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/iCheck/1.0.2/icheck.min.js"></script>

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-fileinput/4.5.3/css/fileinput.css" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-fileinput/4.5.3/js/fileinput.js"></script>

<input id="Archivo" name="Archivo" type="file" accept=".pdf,.doc" disabled />

<input type="checkbox" id="checkbox">

iCheck Enable/Disable Input-File(bootstrap) 当我选中复选框时的按钮

iCheck Enable/Disable Input-File(bootstrap) Button when i check a checkbox

javascript

jquery

checkbox

file-io

icheck