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

HTML using onclick input to run javascript code

本文关键字：运行 javascript 代码 输入 使用 onclick HTML      更新时间：2023-09-26

我目前正在尝试实现一个菜单与许多可点击的按钮-开胃菜，汤等。通过使用参数，我可以将食物的类型发送到我的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测试来运行不工作的行?

你应该使用$，并注意你的引号::

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

在你的例子中:

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

你应该把$test定义为一个对象，而不是一个字符串。

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

用下面的代码试试。应该可以。

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