0

さまざまな入力があるフォームがあります。これらの入力の一部は、 を持つ親 div があるため、最初は非表示になっていdisplay:Noneます。

次に、jQuery を使用して隠しクラスを削除します。私のコンピューターでは、以前は非表示になっていた div が瞬時に表示されます。iPod Touch では、完全に 3 秒かかります。約 100 のチェックマーク入力と CSS 書式設定があります。入力は、さまざまなイベント リスナーにもアタッチされます。分割を再び非表示にするのも同じくらい遅いです (このコードは示されていません)。

助言がありますか？

CSS:

.hidden: {display:None}

html (簡体字):

<div id = "expand"></div>
<div class = "hidden" id = "city_div">
   some city <input type="checkbox">
   ...
</div>

脚本：

$("[id = expand]").live('click', function() {
    $("[id = city_div]").removeClass("hidden");
});

編集: 私はもともと iPhone を書きましたが、これは iPod Touch です。修正しました。

4

2 に答える 2

1

交換

$("[id = expand]").live('click', function() {
    $("[id = city_div]").removeClass("hidden");
});

と

$("#expand").live('click', function() {
    $("#city_div").removeClass("hidden");
});

それははるかに速いはずです。セレクターは、jQuery に単純に を呼び出させるのではなく、すべての要素を探していましたdocument.getElementById。

また、ハンドラーをバインドするときに #expand 要素が存在する場合は、使用します

$("#expand").on('click', function() {
    $("#city_div").removeClass("hidden");
});

ところで、必ず最新バージョンの jQuery を使用してください。

EDIT : 見かけのように、特定の ID を持つ要素が複数ある場合は、それを変更してください。無効であり、バグにつながり、最適化を妨げます。クラスを使用すると$('.classname')、jQuery がネイティブで高速getElementsByClassNameな機能を使用できるようになります。

于 2013-03-03T12:42:37.790 に答える
0

このように非表示の親にアクセスすると、パフォーマンスが向上するのでしょうか?

$(".your-new-class").live('click', function() {
    $(this).parent().removeClass("hidden");
});

これは、非表示のアイテムがクリック可能な子の直接の親であることを前提としています。

于 2013-03-04T09:12:18.630 に答える