Question

如何让这段代码显示图片？我正在使用iFrame，但被告知我是否最终想要将文本链接到使用Div和.load的每张图片会更好。尽管使用Div，我似乎无法加载任何东西。

...

这就是我现在截至2013年12月26日

我已经能够整合到目前为止学到的所有信息。

<!DOCTYPE html>
 <html>
    <cfquery datasource="AccessTest" name="qTest">
        SELECT Account, Image, Image_ID
        FROM PictureDB
    </cfquery>

SELECT Accounts，Remarks，Users，Image_ID 来自CommentPicture

    <script src="http://code.jquery.com/jquery-2.0.3.js"> </script>

<script>
$(document).ready(function(){

    var images = {

    <cfloop query="qTest">
    "<cfoutput>#qTest.Image_ID#</cfoutput>": "<cfoutput>#qTest.Image#</cfoutput>",
    </cfloop>
    };

    $("button").click(function(event){
        event.preventDefault();
        var id = $(this).data("id");
        var src = images[id];

        $("#theImage").attr("src", src).removeClass("hide");

    });

});
</script>

<div id="div1">
    <h2>Display Image</h2>
</div>

    <cfoutput query="qTest">
        <button data-id="#qTest.Image_ID#">#qTest.Account# </button>
    </cfoutput>
    <img id="theImage" class="hide">
</html>

enter image description here

Answer 1

您需要将#qTest.image#的电话打包到<cfoutput></cfoutput>。否则，CF不会处理它。

<cfoutput>#qTest.image#</cfoutput>

此外，jQuery的load（）方法接受一个URL并从服务器加载数据。它不会插入HTML。

你想要像

这样的东西

$("#div1").html('<img src="<cfoutput>#qTest.Image#</cfoutput>">');

Answer 2

.load（）将从url信息加载，但你要做的是一个简单的.append（）或.html（）。

这会将图像添加到div中。

使用Div和.load显示图像

2 个答案: