jQuery使用变量获取img src？

Question

我已经阅读了100多个关于此问题的主题,但无论我做什么我都不能像我想的那样做.我的问题是我得到了img src="url"我的script.当我提醒它时,它给了我想要的正确输入,但是当我把它放在attr()标签中时,我只是发布了" imgSrc"并且在图像的路径中.当我在鼠标悬停功能中对图像进行硬编码时,它可以正常工作.

继承我的剧本

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

            //Hides the images
            $('#imgwrap img').hide();

            //Create variables for Link & Images
            $('a.imgflash').mouseover(function(){
                var linkRel     =   $(this).attr('rel');

                $('#imgwrap img').each(function(i,ele){
                    if($(this).attr('rel') == linkRel) {
                        var imgSrc      =   $(this).attr('src');
                    }               
                });

            });

            //Script that makes images apears
            //Mouseover Script
            $('a.imgflash').mouseover(function(){           
                $('#imgwrap img').attr("src", imgSrc).show();
            });
        });
    </script>

继承我的HTML

<ul>
    <li><a rel="demo1" class="imgflash" href="#">demo1</a></li>
    <li><a rel="demo2" class="imgflash" href="#">demo2</a></li>
    <li><a rel="demo3" class="imgflash" href="#">demo3</a></li>
</ul>
<div id="imgwrap" style="width:300px; height:300px; overflow:hidden;">
<img rel="demo1" src="images/lux.jpg">
    <img rel="demo2" src="images/cover.jpg">
    <img rel="demo3" src="images/cover2.jpg">
</div>

我希望你能帮助我如何让我的变量"imgSrc"发布,就像我想要的鼠标悬停功能一样.

Answer 1

        var imgSrc = '';
        //Create variables for Link & Images
        $('a.imgflash').mouseover(function(){
            var linkRel     =   $(this).attr('rel');

            $('#imgwrap img').each(function(i,ele){
                if($(this).attr('rel') == linkRel) {
                    imgSrc      =   $(this).attr('src');
                }               
            });

        });

您需要在mouseover事件函数之外定义imgSrc变量,因为当您尝试将其应用于它时attr,它不存在.

您可以在此处阅读有关本地/全局变量的更多信息

http://www.w3schools.com/js/js_variables.asp