使用ajax加载内容时,对话框模式中的图像预览不起作用

时间:2016-10-21 20:44:09

标签: php html ajax

<table id="result">
<a href='#' class='pop'><span class='fa fa-eye'><img src='image link here' style='display:none'></a>
</table>

以上href用于以模态打开图像。

Modal For Image Preview:
<div class="modal fade" id="imagemodal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" style="position:absolute">
            <div class="modal-dialog">
                <div class="modal-content">              
                <div class="modal-body">
                    <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
                    <img src="" class="imagepreview" style="width: 100%;" >
                </div>
                </div>
            </div>
          </div>

以下jquery(part1 + part2)在父页面中工作,但每当使用ajax加载表内容时,预览都不起作用。

jQuery for modal show:
part1 : $(function() {
        $('.pop').on('click', function(e) {
            e.preventDefault();
            $('.imagepreview').attr('src', $(this).find('img').attr('src'));
            $('#imagemodal').modal('show');   
        });     
    });

part1在父页面中工作。

Part2 :$("#results").on("click",".pop", function(){
        //alert("hello");
        e.preventDefault();
        $('.imagepreview1').attr('src', $(this).find('img').attr('src'));
        $('#imagemodal1').modal('show');
    });

part2也在点击时显示警告但图像预览不起作用。 任何帮助,将不胜感激。

1 个答案:

答案 0 :(得分:0)

部分问题可能是第2部分中的类和id引用吗?您的示例中不存在课程imagepreview1和ID imagemodal1。它们应该是imagepreview还是imagemodal

出了什么问题?我认为第2部分没有显示图像预览,但是第1部分也有问题吗?如果ajax打破你的第1部分,你能给出你的ajax加载样本吗?