为什么jQuery代码不起作用？

我正在尝试制作一个简单的工具提示函数（我正在尝试学习jQuery，所以请不要建议使用插件）。当我这样写的时候，它是有效的：

             $('span.toolTip').hide();
             function toolTip() {
                $('.targetLink').mouseover(function() {                
                    $('.toolTip').show().html('Hello there');
                });
            }

            <span class='toolTip'></span>
            <a href="#" class="targetLink">Hover over me</a>

$（'span.toolTip'）.hide（）；
函数工具提示（）{
$（'.targetLink'）.mouseover（函数（）{
$（'.toolTip'）.show（）.html（'Hello here'）；
});
}

但当我尝试通过函数传递参数时，它不起作用：

    $('span.toolTip').hide();
    function toolTip(target, tooltip, message) {
        var target = '.' + target;
        $(target).mouseover(function() {
            var tooltip = '.' + tooltip;
            $(tooltip).show().html(message);
        });
    }

    toolTip('targetLink', 'toolTip', 'Hello There');

    <span class='toolTip'></span>
    <a href="#" class="targetLink">Hover over me</a>

$（'span.toolTip'）.hide（）；
功能工具提示（目标、工具提示、消息）{
var target='.'+target；
$（目标）.mouseover（函数（）{
变量工具提示='.'+工具提示；
$（工具提示）.show（）.html（消息）；
});
}
工具提示（“targetLink”、“工具提示”、“您好”）；

由于变量

未定义，您没有得到正确的答案，它应该是：

function toolTip(target, tooltip, message) {
    $('.' + target).mouseover(function() {
        $('.' + tooltip).show().html(message);
    });
}

当前您正在创建一个新变量…没有生成正确的选择器
 您使用新的本地
target
变量“隐藏”了
target
参数：

function toolTip(target, tooltip, message) {
    // this target is not the same as the parameter target
    var target = '.' + target;

只需删除
var
即可：

function toolTip(target, tooltip, message) {
    target = '.' + target;
    ...

由于变量
工具提示
未定义，代码无法工作

$(target).mouseover(function() {
    var tooltip = '.' + tooltip;
    alert(tooltip); //undefined
    $(tooltip).show().html(message);
});

请参阅中的错误

编辑

正如@nick所说，您正在使用
var工具提示中的关键字
var
创建一个新的局部变量。因此，若要修复，请删除
var
，您将获得外部变量（）

请参阅中的正确代码

他正在添加新的。在函数中：
target='.+target
+1。这就是问题所在。有时它被称为变量阴影。另一种解决方案是使用不同名称的变量，而不是删除
var
，例如
函数工具提示（目标、工具提示、消息）{var targetSelector='.+target；..
$(target).mouseover(function() {
    tooltip = '.' + tooltip;
    $(tooltip).show().html(message);
});