1

昨日jQueryとJavaScriptを使い始めて、エラーが発生しました。

私が欲しいのは、H1-タグの後にランダムに広告を配置することです（つまり、2 = 5 AdPositionで分割されたページに10個のH1があるとしましょう）、ランダムに選択されたH1の後に5個のAdBlockを追加します。

とても簡単に聞こえますが、これを達成することはできません...：/jQueryまたはmyCodeは1つのAdBlockしか貼り付けないためです。

JsFiddle：http ://jsfiddle.net/byt3w4rri0r/eCBCK/-動作しています！

MyHTML：

<body>
<div id="content-inner">
    <h1 class="headline">Headline</h1>
    <h1 class="headline">Headline</h1>
    <h1 class="headline">Headline</h1>
    <h1 class="headline">Headline</h1>
    <h1 class="headline">Headline</h1>
    <h1 class="headline">Headline</h1>
    <h1 class="headline">Headline</h1>
    <h1 class="headline">Headline</h1>
    <h1 class="headline">Headline</h1>
    <h1 class="headline">Headline</h1>
</div>
</body>​

MyJQUERY / JavaScript：

//count H1
var countH1 = parseFloat($("#content-inner h1").length)-1; //-1 because 0 is also a number!

//how often the ads should be displayed
var ad_count = Math.round(countH1 / 2);

//random helper
var min = 0;
var max = countH1;

//random position
for (counter = 0; counter < ad_count; counter++){
    var random_position = Math.round((Math.random() * (max - min)) + min);

    console.log("Random_Position:", random_position);

    // paste google-code

    if ($(".headline").hasClass('advertised') == true) {
        random_position++;

        console.log('already advertised!')

        if (random_position > countH1) {
            random_position--;
            }
    } else {
        $('h1:eq('+random_position+')').append('<div class="google_ad1"></div>');
        $('h1.headline').addClass('advertised');
        }
}

console.log("CountH1 -1, because 0=1, 1=2,....", countH1);
console.log(werbung_anzahl);
console.log(zufall_position);
console.log(counter);
4

3 に答える 3

1

この行で

if ($(".headline").hasClass('advertised') == true)

.headline要素のいずれか（！）がすでにアドバタイズされているかどうかを確認しています。そして、最初のステップの後、アドバタイズされた.headlineが常に1つあるので、この比較は真になります。

やりたいこと：現在のインデックスの.headlineがアドバタイズされているかどうかを確認します

if ($(".headline").eq(random_position).hasClass('advertised') == true)

これに加えて、すべての（！）h1.headline要素に「アドバタイズされた」クラスを追加します。これはあなたが代わりにやりたかったことです

$('h1.headline').eq(random_position).addClass('advertised');

編集：これは、 http：//jsfiddle.net/eCBCK/19にある最新のフィドルから完全に変更されたforループです。

for (counter = 0; counter < ad_count; counter++){
    var random_position = Math.round((Math.random() * (max - min)) + min);

    console.log("Random_Position:", random_position);

    // paste google-code

    if ($(".headline").eq(random_position).hasClass('advertised') == true) {
        counter--;

        console.log('already advertised!')


    } else {
        $('h1:eq('+random_position+')').append('<div class="google_ad1"></div>');
        $('h1.headline').eq(random_position).addClass('advertised');
        }
}
于 2012-10-02T09:28:33.970 に答える
0

私が間違っている場合は誰かが私を訂正しますが、すべてのh1要素に「アドバタイズされた」クラスを追加しています。これは、2番目のループで、アドバタイズされたものがすでにh1に追加されているかどうかをテストしていることを意味します。 trueであり、追加は追加されません

于 2012-10-02T09:28:36.643 に答える
0

jQueryのチェーン機能を使用します。

$('h1:eq('+random_position+')').append('<div class="google_ad1"></div>').addClass('advertised');

これにより、追加advertisedしたH1にのみクラスが追加されます。

于 2012-10-02T09:36:48.923 に答える