Question

我目前正在尝试使用许多可点击按钮实现菜单 - 开胃菜，汤等。通过使用参数，我可以将食物类型发送到我的JavaScript。
这些是按钮 http://puu.sh/kugEs/5048221343.jpg

这是我点击开胃菜时的代码。

function scroll(type) {
    var test = "('#" + type + "')";
    alert(test); //('#appetizers')

    $("html, body").animate({ scrollTop: $test.offset().top-150 }, 600); //this doesnt work
    $("html, body").animate({ scrollTop: $('#appetizers').offset().top-150 }, 600); //this works
}

当然我想做到这一点，以便我不必手动使用工作线。我想使用一个不起作用的那个，它可以应用于运行相同功能的所有按钮，只有不同的参数。

如何使用var测试来运行不起作用的行？

Answer 1

您应该使用$并注意引号::

var $test = $('#' + type);  // Now it's a jQuery Object

在你的例子中：

function scroll(type) {
    var $test = $('#' + type);
    $("html, body").animate({ scrollTop: $test.offset().top-150 }, 600);
}

Answer 2

您应该将$ test定义为对象，而不是字符串。

function scroll(type) {
    var test = $('#' + type);
    alert($test.attr("id")); // appetizers
    $("html, body").animate({ scrollTop: $test.offset().top-150 }, 600);
}

Answer 3

尝试使用此代码。它应该工作。

function scroll(type) {
    var test = "('#" + type + "')";      
    alert(test); //('#appetizers')
    $("html, body").animate({ scrollTop: $('#'+type).offset().top-150 }, 600);
}

HTML使用onclick输入来运行javascript代码

3 个答案: