Question

是否可以使用Handlebars.js访问URL参数值并将其显示在当前页面上？

例如，我有一个URL为pageName?id=12345&price=1250的页面。我想在页面上显示id和price的值。是否可以使用把手访问这些值？

类似的东西：

<td>Id: {{id value goes here}}</td>
<td>Price: {{price value goes here}}</td>

Answer 1

您可以使用registerHelper在URL中搜索参数值，并将其返回为模板。

Handlebars.registerHelper('getParam', function(param) {
    const url = new URL("https://www.example.com/pageName?id=12345&price=1250");
    return url.searchParams.get(param);
});

var t = Handlebars.compile($('#t').html());
$('body').append(t({
    id: "id",
    price: "price"
}));

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/handlebars.js/4.1.2/handlebars.min.js"></script>
<script id="t" type="text/x-handlebars">
  <p>Id: {{getParam id}}</p>
  <p>Price: {{getParam price}}</p>
</script>

车把JS：如何在页面上显示URL参数值

1 个答案: