<分区>
标签 javascript jquery html css
<分区>
我有这段代码,应该允许我执行我在代码段中执行的操作。它在代码段中有效,但在我的本地 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>
最佳答案
可能是 jquery 绑定(bind)后加载的 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)');
}
});
});
关于javascript - 为什么我的图像按钮没有打开它应该打开的链接?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38405695/