我正在使用此Image Picker jQuery插件(http://rvera.github.io/image-picker/)来显示图片并进行多项选择
所有事情都有效如果我使用这样的正常选择。
<select class="image-picker">
但是当我尝试通过包含属性多次
来使用多个选择时<select class="image-picker" multiple="multiple">
所有图像都冻结,无法选择,我甚至无法选择一张图像。
这是我的源代码
<!DOCTYPE html>
<html>
<head>
<style>
.image_picker_image {
max-width: 140px;
max-height: 100px;
background-color: #FF0000;
}
</style>
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js"></script>
<script src="image-picker/image-picker.js"></script>
<link rel="stylesheet" href="image-picker/image-picker.css" />
<script type="text/javascript">
$(document).ready(function () {
$("select").imagepicker();
});
</script>
</head>
<body>
<!--code for imagepicker-->
<select class="image-picker" multiple="multiple">
<option data-img-src="http://placekitten.com/220/200" value="1">Cute Kitten 1</option>
<option data-img-src="http://placekitten.com/180/200" value="2">Cute Kitten 2</option>
<option data-img-src="http://placekitten.com/130/200" value="3">Cute Kitten 3</option>
<option data-img-src="http://placekitten.com/270/200" value="4">Cute Kitten 4</option>
</select>
</body>
</html>
答案 0 :(得分:0)
使用超时来推送图像。 我认为这可以通过按一定间隔一次推送图像来解决内存问题:
this.imagePicker.getPictures({
maximumImagesCount: 10,
width:512,
height:512,
outputType: 1 ,
quality:45
}).then((results) => {
for (var i = 0; i < results.length; i++) {
if(results[i] ){
let thisimg = {
"src":'data:image/jpeg;base64,' + results[i]
};
setTimeout(()=>{
this.imageLists.push( thisimg );
},1000)
//this.imageLists.reverse();
}
}
}, (err) => {
this.events.publish("toast",err);
});