Javascript 显示从数据库(C#和JS)检索到的图像

Javascript 显示从数据库(C#和JS)检索到的图像,javascript,asp.net,Javascript,Asp.net,我发现已经有很多类似我的主题,但经过一些研究和努力,我仍然没有找到一个有助于解决我具体问题的主题 我已经编写了从数据库检索图像引用的C#代码。此代码似乎按预期工作。我还编写了somjs代码,该代码应该使用前面提到的引用在html页面上放入一个“src”。JS代码肯定是个问题,因为它没有完成我想让它做的事情。我不知道如何运行这个JS代码,因为它应该在页面加载时运行,而不是在用户单击按钮或链接时运行。 代码如下: Htm代码: <asp:Content ID="Content1" Conten

我发现已经有很多类似我的主题,但经过一些研究和努力,我仍然没有找到一个有助于解决我具体问题的主题

我已经编写了从数据库检索图像引用的C#代码。此代码似乎按预期工作。我还编写了somjs代码,该代码应该使用前面提到的引用在html页面上放入一个“src”。JS代码肯定是个问题,因为它没有完成我想让它做的事情。我不知道如何运行这个JS代码,因为它应该在页面加载时运行,而不是在用户单击按钮或链接时运行。 代码如下:

Htm代码:

<asp:Content ID="Content1" ContentPlaceHolderID="head" Runat="Server">    
    <script src="JS/ImageFromDB/ImageDBHandler.js" type="text/javascript"></script>
    <asp:Literal ID="literal" runat="server"></asp:Literal>
</asp:Content>
    <asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">
      <div id="slideshow">  
         <img id="imageView" src="" alt="" class="active" runat="server" />
      </div> 
    </asp:Content>
---------------------------------以防万一-----------------------------------

下面是html页面的c#类。此类调用从数据库进行查询的类

    private WebLogic logic = new WebLogic();

    public void GetImageForView()
        {
            string images= logic.LoadImagesFromDB(); 
            literal.Text = images;
     //       imageView.Src = HttpUtility.UrlDecode(images);
        }
我真的希望你们这些专家能帮我解决这个问题,我已经连续三天在努力解决这个问题了。
提前感谢

您的方法似乎有些混乱。据我所知,您希望下载指向图像的URL列表,然后使用imageView图像显示它们。首先,您非常需要至少基本的JS知识来理解正在发生的事情。我看到您已经在使用jQuery了。如果您遇到错误,您应该检查jQuery库是否正确地包含在您的网站中(例如)。您还应根据您正在使用并计划与之兼容的浏览器(例如Firebug、Chrome开发工具、IE中的F12等),友好地使用浏览器开发工具

关于您的问题,您可以使用AJAX调用()调用您的服务器方法LoadImagesFromDB。负责此类调用的函数可能如下所示,例如

var getImages = function () {
                   $.ajax({
                       type: "POST",
                       url: "YourPage.aspx/LoadImagesFromDB",
                       data: "{}",
                       contentType: "application/json; charset=utf-8",
                       dataType: "json",
                       async: true,
                       cache: false,
                       success: imagesUrlsReceived
                   });
                   return false;
              };
接下来需要修改服务器端方法:它必须是静态的,并且必须用[WebMethod]属性修饰。更重要的是,您不包括脚本标记等。您应该返回的只是一个包含url的字符串数组(我没有检查url创建过程,您可以自己验证这是否生成正确的链接)。它可能类似于下面的代码:

public static string[] LoadImagesFromDB()
    {
        Sql sql = new Sql();
        string query = "SELECT Location FROM GalleryImages";
        MySqlCommand cmd = sql.Command(query);
        DataTable dt = sql.DataTable(cmd);

        string[] images = new string[dt.Rows.Count];

        for(int i = 0; i < dt.Rows.Count;i++)
        {
            images[i] = HttpUtility.UrlDecode(dt.Rows[i]["Location"].ToString());
        }

        return images;
    }
现在是最重要的部分。你的电话(至少有这一点信息)表明

function imageSlider() {        
    $("#imageView").attr("src", images[this.length]);
}
就目前而言,这毫无意义。您应该在JavaScript(例如)中阅读有关作用域和它的内容。我想你想展示图片列表中的图片。要显示列表中的第一张图片,您可以这样做:

function showFirstImage() {        
    $("#imageView").attr("src", images[0]);
}
function imageSlider(imageNum) {        
    $("#imageView").attr("src", images[imageNum]);
}
当然,这不是我们可能想到的最通用的解决方案,这就是为什么我们可以这样实施它:

function showFirstImage() {        
    $("#imageView").attr("src", images[0]);
}
function imageSlider(imageNum) {        
    $("#imageView").attr("src", images[imageNum]);
}
其中imageNum是images数组中图像的基于0的索引。值得一提的是,imageSlider函数应该在images变量填充从服务器下载的URL之前调用。否则,images变量将保持为空

除了我画的草图,这里还有很多事情要做。您应该注意可能出现的错误(如果我将字符串而不是数字作为imageNum传递,如果imageNum为null或未定义,或者imageNum超出范围,例如小于0或大于images.length怎么办?)


然而,我想我已经给了你一个粗略的计划,在这种情况下应该采取什么行动。我不保证这是剪切粘贴代码,它只是作为一个说明和指导,而不是一个完整的解决方案。

非常感谢,这很有意义。我相信这会有帮助的。我会照你说的做,好吧,那我很高兴。如果你被困在什么地方,请告诉我。如果你这样做,它的工作,然后请标记为接受我的答案。嗨再次。如何填充var映像=[];?我也有点迷恋这个方法:imagesUrlsReceived=function(results)。“result”参数看起来如何,以及在哪里作为参数给出?具体来说,我正在考虑如何从以下url获取数据:“YourPage.aspx/LoadImagesFromDB”
function imageSlider(imageNum) {        
    $("#imageView").attr("src", images[imageNum]);
}