解释 Asp.net 中的滑块代码

Posted 2023-02-25

【中文标题】解释 Asp.net 中的滑块代码

【英文标题】：Explain slider code in Asp.net

【发布时间】：2013-11-24 16:21:53

【问题描述】：

我在 ASP.net 中使用 c# 我从这里得到了这个代码http://www.c-sharpcorner.com/UploadFile/c63ec5/build-image-slider-with-Asp-Net/ 它工作正常，有人可以对每一行进行简短的一行描述。

<script type="text/javascript" src="http://jqueryjs.googlecode.com/files/jquery-1.3.2.min.js"></script>
    <script type="text/javascript">
        var NoofImage = ['http://localhost:64916/images/img1.png', 'http://localhost:64916/images/img2.jpg', 'http://localhost:64916/images/img3.jpg', 'http://localhost:64916/images/img4.jpg'];
        var count = NoofImage.length;
        $(function ()  setInterval(Slider, 2000) );
        function Slider()
        
            $('#imageSlide').fadeIn("slow",function()$(this).attr('src', NoofImage[(NoofImage.length++)%count]).fadeIn("slow");
            );
        
    </script>

【问题讨论】：

我认为它不是从数据库中获取的，它是从名为 images 的文件夹中挑选图像

【参考方案1】：

<script type="text/javascript" src="http://jqueryjs.googlecode.com/files/jquery-1.3.2.min.js"></script>

这一行只是从 googlecode.com 加载 jquery 库

<script type="text/javascript">
    var NoofImage = ['http://localhost:64916/images/img1.png', 'http://localhost:64916/images/img2.jpg', 'http://localhost:64916/images/img3.jpg', 'http://localhost:64916/images/img4.jpg'];

这一行将一个字符串数组实例化为您的图像。 （文件位置）

    var count = NoofImage.length;

计算上面数组的长度

    $(function ()  setInterval(Slider, 2000) );

这会运行一个函数，该函数每 2000 毫秒（2 秒）运行一次函数“Slider”

    function Slider()
    
        $('#imageSlide').fadeIn("slow",function()$(this).attr('src', NoofImage[(NoofImage.length++)%count]).fadeIn("slow");
        );
    
</script>

这会为您的图像一次创建一个淡入淡出效果。它淡入“慢”并运行一个内联函数，该函数从当前编号的数组中给出的 URL 实例化图像。在到达最后一个图像后，它使用模数返回到第一个图像。此行依赖于 DOM 元素“imageSlide”。

我希望这能充分回答您的问题。

【讨论】：

我明白了，谢谢，你能告诉更多关于这一行 $('#imageSlide').fadeIn("slow",function()$(this).attr('src', NoofImage[(NoofImage.length++)%count]).fadeIn("slow"); 我已经理解你所说的关于通过模数引入下一张图像的内容，但我不理解这一行中的其余内容

$('#imageSlide') 是 jquery 查找 ID 为“imageSlide”（在您的 html 中）的 DOM 对象的方法。 .fadeIn 是在选定元素 (imageSlide) 上执行的 jquery 命令，后跟函数的一些参数（更多信息：api.jquery.com/fadeIn）。淡入可以采用一个函数采用内联函数 (function() ... ) 并以淡入效果运行它。您的内联函数只需使用“this”语句获取当前选定的元素（imageSlide），并为其提供一个新的图像源（src），然后淡入淡出（换句话说，新图像）中的新源。