开发者

Jquery and Coldfusion Loops

If you are calling a mod开发者_运维知识库al dialog box in jquery, but have the image file location in an array, how would you call this dialog box where if they clicked the link, the image would pop up? Right now, because of a loop it is obviously only using the last file name.

function showDialog(){
    $("#image_viewer").html('<iframe id="modalIframeId" width="100%" height="100%" marginWidth="0" marginHeight="0" frameBorder="0" scrolling="auto" />').dialog("open");
    $("#modalIframeId").attr("src","image_view.cfm");
    return false;
}
$(document).ready(function() {
    $("#image_viewer").dialog({
        autoOpen: false,  
        modal: true,
        height: 800,
        width: 600
    });
});


You're trying to use an iframe as a modal dialog, you should just use a DIV.

<!--- HTML --->
<div id="imageDialog" class="dialog" style="display:none;"></div>

Then you can output a list of links to your images like this:

<!--- CFML --->
<cfoutput query="qImages">
    <a href="#qImages.url#" class="image">#qImages.label#</a><br />
</cfoutput>

Finally, you can open the URL for the image directly into the modal dialog using a bit of class trickery.

<!--- jQuery --->
$(document).ready(function(){ 
    $('.dialog').dialog(
        {
            autoOpen: false,
            modal: true,
            width: 440,
            height: 330,
            title: "Image Viewer"
        }
    ); 

    $('a.image').click(function(e){
        $('#imageDialog').load( $(this).attr('href') ).dialog("open");
        e.preventDefault();
    });
});
0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜