4

長年のユーザー、初めてのポスター。

基本的に、私はさまざまな場所に一連のキオスクを持っており、「液体」を使用して、場所に関連付けられたすべてのバウチャーを自動的にリストに入れるバウチャー システムを持っています。また、このコードを使用して、10 エントリごとに新しいリストを開始しています。次に、jQuery を使用して、リスト間をスライドするスクローラーを追加しました。このコードは非常に単純です。

{% for voucher in vouchers %}
{% capture modulus %}{{ forloop.index0 | mod:10 }}{% endcapture %} 
{% if forloop.index0 != 0 %} 
{% if modulus == "0" %} 
</ul></li><li><ul class="voucherlist"> 
{% endif %}
{% endif %}
<div id="{{ voucher.meta }}" class="voucher_list">
    <li><a href="{{ 'voucher' | url_for_page : voucher.id }}">{{ voucher.meta }}</a></li>
</div>
{% endfor %}

ただし、リスト内の一部の伝票は複数回表示されます。これは、バウチャーが 3 つのカテゴリに分割されており、一部がクロスオーバーする可能性があるためです。いくつかの場所があるため、キーやタグなどをバウチャーに追加して、別の場所で表示したい場合があるため、表示を停止することはできません. さらに、それぞれを手動で調整する必要があり、このシステムのポイントは可能な限り自動化することです。したがって、私はかなり満足しているいくつかの jquery を使用しました。

<script type="text/javascript">
    $(document).ready(function () {
        $('[id]').each(function () {
            var ids = $('[id=' + this.id + ']');
            if (ids.length > 1 && ids[0] == this) {
                $(ids[1]).remove()
            }
        });
    });
</script>

このことから、div id にバウチャー名を使用したことがわかり、jquery は同じ id を持つ div をすべて削除します。ただし、スペースが残っているため、一部のページでは 10 ではなく 8 がオンになっています。したがって、私の質問にたどり着きます。スペースを残さずに Liquid リスト内の重複を削除するにはどうすればよいですか?

「.remove()」を「.hide()」に変更しようとしましたが、使用できません。に変更しました

.addClass( "duplicate" )

次に、液体に行を追加して次のようなことを言うことを期待して

{% if div.class != "duplicate" %}

したがって、「重複」の div を持つものは使用しません。それはいいでしょう。しかし、それを行うためのコードが見つからないか、それが可能かどうかさえわかりません。ここではすべての角度をカバーし、できる限りすべてを説明しようとしました。私はとても近いですが、別の視点がうまくいくかもしれませんか、それとももっと簡単な方法はありますか? 私は正しい軌道に乗っていますか？どんなアイデアでも大歓迎です。

編集：これをさらに説明するための画像を次に示します。http://img683.imageshack.us/img683/6295/voucherpagehelp.jpg また、スクロール システムの説明に役立つ、どこかから引っ張ってきたコードをもう少し追加しました。申し訳ありませんが、これは以前は明確ではありませんでした。

前もって感謝します。

4

2 に答える 2

2

Liquidで重複を削除することについての私の見解は次のとおりです。

{% assign array = 'c|c|b|b|a|a' | split: '|' %}
{% assign result = array[1] %}

{% for item in array %}
    {% unless result contains item %}
        {% capture result %}{{ result }}|{{ item }}{% endcapture %}
    {% endunless %}
{% endfor %}

{{ result | split: '|' | sort | join: ', ' }}
于 2014-03-03T21:19:06.333 に答える
0

jQueryを使用してこのリストを作成する場合は、液体JSONフィルターを使用してバウチャーオブジェクト全体をJavaScriptオブジェクトにキャプチャします。ただし、これを行うための私の好ましい方法は、JavaScriptを使用しないブラウザーがコンテンツを正しく表示できるようにするために、液体を使用することです。

{% assign UsedIDs = '' %}
{% assign Counter = 0 %}
{% for voucher in vouchers %}
{% capture IDToCheck %},{{voucherID}},{% endcapture %}
{% unless UsedIDs contains IDToCheck %}
{% capture modulus %}{{ Counter | mod:10 }}{% endcapture %} 
{% if Counter != 0 %} 
{% if modulus == "0" %} 
</ul></li><li><ul class="voucherlist"> 
{% endif %}
{% endif %}
<div id="{{ voucher.meta }}" class="voucher_list">
    <li><a href="{{ 'voucher' | url_for_page : voucher.id }}">{{ voucher.meta }}</a></li>
</div>
{% capture UsedIDs %}{{ UsedIDs }}{{ IDToCheck }}{% endcapture %}
{% capture Counter %}{{ Counter | plus: 1 }}{% endcapture %}
{% endunless %}
{% endfor %}
于 2011-11-17T05:23:44.137 に答える