0

ドライコードを作成できるように、document.ready イベントでループを作成しようとしています。ただし、ループを介して作成するとクリックイベントは未定義に戻りますが、各 document.ready イベントを個別に宣言すると正常に動作します。

<script>
var $a = jQuery.noConflict();
$a(document).ready(function () {
    $a(".nav-1-1").css('cursor','pointer').click(function(event) {
        window.location.href = $a(".nav-1-1").find("a").attr("href");
    });
});

$a(document).ready(function () {
    $a(".nav-1-2").css('cursor','pointer').click(function(event) {
        window.location.href = $a(".nav-1-2").find("a").attr("href");
    });
});

$a(document).ready(function () {
    $a(".nav-1-3").css('cursor','pointer').click(function(event) {
        window.location.href = $a(".nav-1-3").find("a").attr("href");
    });
});

$a(document).ready(function () {
    $a(".nav-1-4").css('cursor','pointer').click(function(event) {
        window.location.href = $a(".nav-1-4").find("a").attr("href");
    });
});

$a(document).ready(function () {
    $a(".nav-1-5").css('cursor','pointer').click(function(event) {
        window.location.href = $a(".nav-1-5").find("a").attr("href");
    });
});

$a(document).ready(function () {
    $a(".nav-1-6").css('cursor','pointer').click(function(event) {
        window.location.href = $a(".nav-1-6").find("a").attr("href");
    });
});

$a(document).ready(function () {
    $a(".nav-1-7").css('cursor','pointer').click(function(event) {
        window.location.href = $a(".nav-1-7").find("a").attr("href");
    });
});

$a(document).ready(function () {
    $a(".nav-1-8").css('cursor','pointer').click(function(event) {
        window.location.href = $a(".nav-1-8").find("a").attr("href");
    });
});

$a(document).ready(function () {
    $a(".nav-1-9").css('cursor','pointer').click(function(event) {
        window.location.href = $a(".nav-1-9").find("a").attr("href");
    });
});

$a(document).ready(function () {
    $a(".nav-1-10").css('cursor','pointer').click(function(event) {
        window.location.href = $a(".nav-1-10").find("a").attr("href");
    });
});
</script>

上記のコードを単純化するために作成しようとしているループは次のとおりです。

<script>
var $a = jQuery.noConflict();

$a(document).ready(function () {
    for (var i=1; i<11; i++) {
        $a(".nav-1-1"+i).css('cursor','pointer').click(function(event) {
            window.location.href = $a(".nav-1-1").find("a").attr("href");
        });
    }
});
</script>

Trevor が i 変数を含めるのを忘れていたことを指摘したので、上記のループを修正しました。

4

2 に答える 2

1

php と Js を混ぜたら？php を使用して上記の長いコードを生成すると、index.php では同じ小さなコードに見えます。

例：

$a(document).ready(function () {

<?php
$i=0;
 while ( $i < 11)
{
$i++;
?>

    $a(".nav-1-<?php echo $i;?>").css('cursor','pointer').click(function(event) {
        window.location.href = $a(".nav-1-<?php echo $i;?>").find("a").attr("href");
    });

<?php
 }
?>

});
于 2013-11-05T23:25:15.733 に答える