Question

我有这段代码，应该允许我在代码片段中执行操作。它在片段中工作但它在我的本地php文件中不起作用。

我有jquery库，并且所有内容都正确调用，但我正在使用的图像没有激活应该在代码片段中显示的输入文件类型。

$('.image-upload-btn').on('click', function() {
  var input = document.createElement('INPUT');
  input.type = 'file';
  input.style.display = 'none'
  $('html body').append(input);
  input.click();
  input.onchange = function() {
    $('.image-upload-btn').css('background-image', 'url(http://icons.iconarchive.com/icons/martz90/circle/512/camera-icon.png)');
  }
});

.image-upload-btn {
  background-image: url('http://bread.pp.ua/n/settings_g.svg');
  background-position: center;
  background-size: cover;
  width: 50px;
  height: 50px;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<div class='image-upload-btn'></div>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script type="text/javascript">
$('.image-upload-btn').on('click', function(){
     var input = document.createElement('INPUT');
     input.type = 'file';
     input.style.display = 'none'
     $('html body').append(input);
     input.click();
     input.onchange = function(){
         $('.image-upload-btn').css('background-image', 'url(http://icons.iconarchive.com/icons/martz90/circle/512/camera-icon.png)');
     }
});
</script>
<style type="text/css">
.image-upload-btn{
    background-image: url('http://bread.pp.ua/n/settings_g.svg');
    background-position: center;
    background-size: cover;
    width: 50px;
    height: 50px;
}
</style>
<div class='image-upload-btn'></div>

Answer 1

可能是jquery绑定后加载的html，试试这个

$(document).ready(function(){  

  $('.image-upload-btn').on('click', function() {
    var input = document.createElement('INPUT');
    input.type = 'file';
    input.style.display = 'none'
     $('html body').append(input);
     input.click();
     input.onchange = function() {
     $('.image-upload-btn').css('background-image', 'url(http://icons.iconarchive.com/icons/martz90/circle/512/camera-icon.png)');
    }
  });

});

为什么我的图片按钮没有打开它应该的链接？

1 个答案: