jquery - jQuery スタイルを適用できるように ul タグを更新しましたが、私のページには読み込み中の jQuery 画像が表示されるだけです

Question

wordpress 用の woocommerce テーマを開発しています<ul>。要素にいくつかの属性を追加して、jQuery モバイル スタイルを適用できるようにしようとしています。

これを行うために、「woocommerce_before_shop_loop」という名前のフックにスクリプトをエンキューしました。

スクリプトは次のとおりです。

(function ($){
$(document).on('pageinit','#shop', function(){
    $('ul').attr('data-role', 'listview');
    $('ul').attr('data-inset','true');
    });
})(jQuery);

このスクリプトを使用して、必要<ul>なタグに属性を追加することができました。ただし、この方法では jquery モバイル スタイルは適用されません。次に、リストを更新して、jquery がそのクラス属性を動的に追加できるようにしました。新しいスクリプトは次のとおりです。

(function ($){
$(document).on('pageinit','#shop', function(){
    $('ul').attr('data-role', 'listview');
    $('ul').attr('data-inset','true');
    $('ul').listview(); // to refresh the <ul> tag
});
})(jQuery);

このように、私が達成したことは、jqueryがそのクラスを動的に追加できることであり、クロムコンソールを使用して確認できました。しかし、jQuery クラスが追加されたので、私のページにはコンテンツが表示されず、jQuery の読み込みイメージが表示されるだけで、コンテンツは表示されません。

ここで私のウェブサイトを見ることができます: http://danielvivancos.com/edu/wordpress/shop/と読み込み中の画像。<div id="shop" ...>また、スクリプトで設定した属性と jQuery のクラスが<ul>タグに追加されていることを chrome コンソールで確認することもできます。

誰かがこの問題を解決するのを手伝ってくれることを願っています。

ありがとうございます！