1

モバイルデバイス用に表示される小さなセカンダリナビゲーションバーを作成しようとしています。クリックしたリンクに応じて、最終的に特定のdivを表示および非表示にします。すべてが正しく呼び出されているかどうかを確認するためのテストとして、色の変更を使用しています。色の変更はデスクトップブラウザでは正常に機能しますが、スマートフォンでは機能しません。

ここでアドバイスを探した後、「委任」を試みましたが成功しませんでした。とにかく、live()はshow/hide関数に優れていると思います。私が見つけた他のアドバイスはどれも、この状況に関連しているようには見えませんでした。falseを返すのではなく、preventDefaultメソッドを使用してみましたが、2つの実際の違いは明確ではなく、どちらも機能しませんでした。

私は開発者ではなく設計者であり、jqueryは非常に初めてですが、基本的なコーディング用語とベストプラクティスにはある程度精通しています。

$('#nav2 a').unbind("click");

$('#nav2 a').live('click',function(){
    $(this).css('color','#F00');
    return false;
});

HTMLコードは次のようになります。

<div id="nav2"><p><ul>
    <li><a href="index.html">Home</a></li>
    <li><a href="#" class="smOnIssue">In This Issue</a></li>
    <li><a href="#" class="smFeatures">Features</a></li>
    <li><a href="#" class="smArchive">Archive</a></li>
</ul></p></div>

私が言ったように、それはデスクトップ上でうまく機能していますが、モバイルは何もしません。最新バージョンのjqueryを使用しています。ありがとうございました!私はあなたの誰かが私に与えることができるどんな助けにも本当に感謝します。

4

4 に答える 4

0

「jQuery1.7以降、.live()メソッドは非推奨になりました。.on()を使用してイベントハンドラーをアタッチします。古いバージョンのjQueryのユーザーは、.live()ではなく.delegate()を使用する必要があります。」

于 2012-08-27T22:05:06.640 に答える
0

関連付けられているイベントを切り離したい場合は.live().die() 「クリック」イベントの代わりに「タップ」を試してみましたか?

于 2012-11-13T14:58:19.400 に答える
0

モバイル ブラウザで起動する要素に onclick="" を追加するだけです。

<div id="nav2" onclick=""><p><ul>
    <li><a href="index.html">Home</a></li>
    <li><a href="#" class="smOnIssue">In This Issue</a></li>
    <li><a href="#" class="smFeatures">Features</a></li>
    <li><a href="#" class="smArchive">Archive</a></li>
</ul></p></div>
于 2013-08-24T23:02:38.820 に答える
0

document.ready function http://jquerymobile.com/test/docs/api/events.htmlと同等の pageinit 内にコードを配置しようとしましたか。クリックイベントハンドラーをバインドしていない理由は、要素がまだdomで利用できないためです

$(document).bind('pageinit',function(){
    $('#nav2 a').live('click',function(){
        $(this).css('color','#F00');
        return false;
    });
})

上でリンクした jquerymobile doc から

重要: $(document).ready() ではなく、$(document).bind('pageinit') を使用してください

jQuery で最初に学ぶことは、$(document).ready() 関数内でコードを呼び出して、DOM が読み込まれるとすぐにすべてが実行されるようにすることです。ただし、jQuery Mobile では、ナビゲートするときに Ajax を使用して各ページのコンテンツを DOM にロードし、DOM Ready ハンドラーは最初のページに対してのみ実行されます。新しいページが読み込まれて作成されるたびにコードを実行するには、pageinit イベントにバインドします。このイベントについては、このページの下部で詳しく説明しています。

重要: $(document).bind('pagecreate') vs $(document).bind('pageinit')

Beta 2 以前は、jQuery Mobile 拡張ページと子ウィジェットのマークアップを操作したいユーザーへの推奨事項は、pagecreate イベントにバインドすることでした。Beta 2 では、ウィジェット メソッドの直接呼び出しの代わりに pagecreate イベントにバインドすることで、各ウィジェットを分離する内部変更が行われました。その結果、mobileinit で pagecreate にバインドするユーザーは、各プラグインによってマークアップが拡張される前に、バインディングが実行されていることに気付くでしょう。jQuery UI Widget Factory のライフサイクルに合わせて、create メソッドの後に初期化メソッドが呼び出されるため、pageinit イベントは、DOM や Javascript オブジェクトの拡張後の操作に適切なタイミングを提供します。つまり、以前に pagecreate を使用して、ページが表示される前に拡張マークアップを操作していた場合は、

于 2012-08-27T23:24:37.497 に答える