각 클릭 이벤트 후에 동적으로 이미지를로드하고 싶다는 점에서 부트 스트랩 캐 러셀을 사용하고 있습니다.
첫 번째 이미지가 올바르게 표시되지만 Afterwords 데이터가 서버에서 나오지만 ajax 스크립트가 작동하지 않습니다.
HTML
<div id="myCarousel" class="carousel slide" data-ride="carousel">
<!-- Indicators -->
<!-- Wrapper for slides -->
<div class="carousel-inner" role="listbox" id="listbox">
<div class="item active" id="gallery-overlay">
<img src="" alt="taufik">
</div>
</div>
<!-- Left and right controls -->
<a class="left carousel-control" id="pre" href="#myCarousel" role="button" data-slide="prev">
<span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
<span class="sr-only">Previous</span>
</a>
<a class="right carousel-control" id="nxt" href="#myCarousel" role="button" data-slide="next">
<span class="glyphicon glyphicon-chevron-right" aria-hidden="true" id="nxt"></span>
<span class="sr-only" >Next</span>
</a>
</div>
아약스
$(document).ready(function() {
$('#nxt').click(function() {
$.ajax({
url : 'DisplayImage',
data : {
opration : 'next',
username : 'user1'
},
success : function(result) {
$('#gallery-overlay').append('<li><img src="data:image/jpeg;base64,'+result+'"/></li>');
}
});
});
});
결과가 반환되므로 다음을 시도하십시오. 이미 base 64 코드 앞에 data : image / jpeg; base64를 추가 한 것처럼 보이며 결과도 반환되었습니다.
//split the result by the , and get the actual base64 data
$('#gallery-overlay').append('<li><img src="data:image/jpeg;base64,'
+ result.split(",")[1] +'"/></li>');
이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.
침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제
몇 마디 만하겠습니다