基于条件 JQuery 的流动脚本

Liquid Script based on Conditional JQuery

假设我们有一个下拉开关:

<label for="num-of-records">Rows per Page: </label>
<select name="num-of-records" id="num-of-records">
  <option value="" selected>default</option>
  <option value="25">25</option>
  <option value="50">50</option>
</select>

我们还有一个liquid代码:

{% include 'page' key: 'table' %}

对于 key,我为每个下拉选项值提供了一些选项 tabletable25table50

我是 liquid 的新手,但我想创建一个 jquery,其中 select 基于下拉列表的 key 值。

<script>
$(this).append("{% include 'page' key: 'table"+ $.("#num-of-records").val()+"' %}"
</script>

所以假设我选择选项 25,那么它将(可能重新打开页面)附加 liquid 脚本:

{% include 'page' key: 'table25' %}

Liquid 是一种服务器端渲染语言。 jQuery 在 Liquid 之后呈现,因此您无法继续此操作。

一种可行的方法(不是简单的方法)可能是渲染所有 Liquid 外壳,隐藏它们,然后使用 jQuery.

显示您想要的那个