ICode9

精准搜索请尝试: 精确搜索
首页 > 编程语言> 文章详细

如何在JavaScript中连接变量和字符串?

2019-10-13 01:35:56  阅读:23  来源: 互联网

标签:javascript variables string concatenation


请不要立即将其标记为重复项.我看过类似的问题,但仍然无法解决.

这是我目前拥有的:

$(document).ready(function(){
    for(var i=1;i<2;i++)
    {
        $("#MenuBarButton"+i).mouseover(function(){
            $("#ldheMenuBarLayer"+i).stop().animate({height:'66px'},{queue:false, duration:600, easing: 'easeOutBounce'})
        });
        $("#MenuBarButton"+i).mouseout(function(){
            $("#ldheMenuBarLayer"+i).stop().animate({height:'41px'},{queue:false, duration:600, easing: 'easeOutBounce'})
        });
    }
});

那不行什么也没有发生,并且控制台中什么也没有出现.但是,如果我在每个$函数中直接将i替换为1,那么它将起作用.

我对编程并不陌生,但是对JavaScript不熟悉,所以我做错了什么吗?谢谢!

编辑:当我说我将i替换为1时,这是因为ID为MenuBarButton1和ldheMenuBarLayer1.

解决方法:

您的基本问题是i永远只有一个值.该变量仅存在一次.事件处理程序中的代码指向变量,而不是创建事件处理程序时的值.因此,请使用如下代码:

$("#ldheMenuBarLayer"+i).stop()...

每次运行事件处理程序时,我将为2,因为我们已经完成了整个循环.

您需要使用i的值,而不是对变量的引用.为此,您可以引入一个带有匿名立即调用功能的新作用域:

for(var i=1;i<=2;i++)
{
    (function(j) {
        $("#MenuBarButton"+j).mouseover(function(){
            $("#ldheMenuBarLayer"+j).stop().animate({height:'66px'},{queue:false, duration:600, easing: 'easeOutBounce'})
        });
        $("#MenuBarButton"+j).mouseout(function(){
            $("#ldheMenuBarLayer"+j).stop().animate({height:'41px'},{queue:false, duration:600, easing: 'easeOutBounce'})
        });
    }(i))
}

抛开所有这些,值得一提的是,这并不是一种类似于jQuery的方法. jQuery的方式可能如下所示:

var menuBarButtons = $('.menuBarButton').mouseover(function() {
    var idx = menuBarButtons.index(this);

    $('.ldheMenuBarLayer')
        .eq(idx)
        .stop()
        .animate(
             {
                 height: '66px'
             },
             {
                 queue: false,
                 duration: 600,
                 easing: 'easeOutBounce'
             }
         );
});

该代码将无法正常工作(可能).它需要基于您的标记和页面结构.最终可能无法实现.

标签:javascript,variables,string,concatenation
来源: https://codeday.me/bug/20191013/1904499.html

专注分享技术,共同学习,共同进步。侵权联系[admin#icode9.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有