Question

你好编码器我搜索了很多，但没有找到任何与 jcarousel 相关的东西与数据库一起工作所以我来这里问你的帮助我有一个页面，其中我使用 jcarousel

CSS
js

文件现在使用了这个，当我把文本放在列表中它工作正常但是如果我使用从数据库获取文本并将其放在列表中它只显示前3条记录，当我点击下一步按钮没有工作意味着它不会显示下一个文本...例如我想在此链接中查看示例编号4

Example4 这是我的代码：

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Responsive Carousel - jCarousel Examples</title>

    <link rel="stylesheet" type="text/css" href="../_shared/css/style.css">

    <link href="../../jcarousel.responsive.css" rel="stylesheet" type="text/css" />

    <script type="text/javascript" src="../../libs/jquery/jquery.js"></script>
    <script type="text/javascript" src="../../dist/jquery.jcarousel.min.js"></script>       
    <script src="../../jcarousel.responsive.js" type="text/javascript"></script>       

</head>
<body>

    <div class="wrapper">
        <h1>Responsive Carousel</h1>                       
        <p>This example shows how to implement a responsive carousel. Resize the browser window to see the effect.</p>
        <div class="jcarousel-wrapper">
            <div class="jcarousel">                
                <ul>
                  <li>Hello</li>
                  <li>Make it</li>
                  <li>Quick</li>
                  <li>or</li>
                  <li>you are</li>
                  <li>Fired</li>
                  <li>Understand</li>
                </ul>
            </div>

            <a href="#" class="jcarousel-control-prev">&lsaquo;</a>
            <a href="#" class="jcarousel-control-next">&rsaquo;</a>

            <p id="images" class="jcarousel-pagination"></p>
        </div>
    </div>

但是如果我使用数据库移动3个文本之后;它不起作用这是我的代码：

 <div class="wrapper">
        <p>This example shows how to implement a responsive carousel. Resize the browser window to see the effect.</p>
           <div id="jc2" class="jcarousel-wrapper">
              <div class="jcarousel">
                 <asp:Repeater ID="rptImages" runat="server">
                    <ItemTemplate>
                       <ul>
                           <li>
                            <asp:Label ID="imagename" runat="server" Text='<%# Bind("Image_Name") %>'></asp:Label>
                           </li>
                       </ul>
                   </ItemTemplate>
                 </asp:Repeater>                                           
              </div>
                <a href="#" class="jcarousel-control-prev">&lsaquo;</a>
                <a href="#" class="jcarousel-control-next">&rsaquo;</a>

                <p id="imagename" class="jcarousel-pagination"></p>
       </div>
  </div>
</body>
</html>

这是代码背后的代码：

protected void Page_Load(object sender, EventArgs e)
{
    try
    {
        con.Open();
        string query = "select * from Image_Master";
        SqlDataAdapter da = new SqlDataAdapter(query, con);
        DataSet ds = new DataSet();
        da.Fill(ds);
        rptImages.DataSource = ds;
        rptImages.DataBind();            
    }
    catch (Exception ex2)
    {
        Response.Write("<script>alert('An Error occurred. Administrator has been notified..!');</script>");
    }
    finally
    {
        if (con.State == ConnectionState.Open)
        {
            con.Close();
        }
    }
}

我希望你们理解我的问题，如果有任何与代码相关的查询请问我需要你的帮助。提前谢谢!!!

Answer 1

可能不起作用，因为您的Repeater没有制作Carousel De-mystified要求的HTML格式。

这是等待的html：

<div class="slider1">
  <div class="slide"><img src="image.jpg"></div>
  .....
</div>

并且您的转发器必须如下：

<div class="jcarousel">
 <asp:Repeater ID="rptImages" runat="server">
    <ItemTemplate>
        <div class="slide"><img src='/images/<%# DataBinder.Eval(Container.DataItem, "Image_Name") %>'  /></div>
   </ItemTemplate>
 </asp:Repeater>                                           
</div>

在此代码中，请确保使用您的css，javascript代码和路径确定名称，ID，图片路径是否正确。

回答主要问题，任何javascript库都与服务器端编程和数据库无关。任何javascript库通常都会要求特定的html格式或特定的数据格式。如果你从代码中提供，那么你可以使它工作。

jcarousel可以与数据库一起工作吗？

1 个答案: