0

文言+スクリーンショットで説明します

以下を含む3つのコンテナがあります。

ここに画像の説明を入力

それぞれに異なる ID と同じクラスがあります。

<div id="container" class='list-cont'>
    <h2> One Two Three Four</h2>
</div>

<div id="container-1" class='list-cont'>
    <h2> Four Five Six </h2>
</div>

<div id="container-2" class='list-cont'>
    <h2> Seven Eight Nine Ten Eleven</h2>
</div>

私がやっていることの目的は、各コンテナの単語の前半を別の色にし、残りの部分も別の色にすることです。しかし、主な問題は、コードが常にループしていて、なぜそれが起こっているのかわからず、ページがノンストップでリロードされることです。

ここに画像の説明を入力

コード：

//Count total number of div's which has a class of list-cont
var div_items = $(".list-cont").length;

for (var q = 1; q <= div_items; q++) {
  //If 1 the container who doesn't have "-" will get an update
  if (q = 1) {

    //Get value of h2 of the container who doesn't have "-"
    var s = $('div#container h2').html();

    s = s.replace(/(^\s*)|(\s*$)/gi,"");
    s = s.replace(/[ ]{2,}/gi," ");
    s = s.replace(/\n /,"\n");

    //Number of words
    var str_length = s.split(' ').length;

    //Words in an array
    var str_array = s.split(' ');

    //Get total of first half of words
    var len_first = Math.round(str_length / 2);

    //Delete Value of h2
    $("div#container h2").html('');

    for (var ctr = 0; ctr < str_length; ctr++) {
      if (ctr >= len_first) {
        $("div#container h2").append(" <font color='#fdbd16'>"+ str_array[ctr] +"</font> ");
      } else {
        $("div#container h2").append(" " + str_array[ctr] + " ");
      }
    }
  } else {
    //Container has "-" like container-1 or container-2

    //Get value of h2 of the container who doesn't have "-"
    var s = $('div#container-'+ q +' h2').html();

    s = s.replace(/(^\s*)|(\s*$)/gi,"");
    s = s.replace(/[ ]{2,}/gi," ");
    s = s.replace(/\n /,"\n");

    //Number of words
    var str_length = s.split(' ').length;

    //Words in an array
    var str_array = s.split(' ');

    //Get total of first half of words
    var len_first = Math.round(str_length / 2);

    //Delete Value of h2
    $("div#container-"+ q +" h2").html('');

    for (var ctr = 0; ctr < str_length; ctr++) {
      if (ctr >= len_first) {
        $("div#container-"+ q +" h2").append(" <font color='#fdbd16'>"+ str_array[ctr] +"</font> ");
      } else {
        $("div#container-"+ q +" h2").append(" " + str_array[ctr] + " ");
      }
    }
  }
}
4

1 に答える 1

2

あなたのコードには多くの問題がありますが、それを無限にループさせているのはこれです

for (var q = 1; q <= div_items; q++) {
    if (q = 1) {
        // q is now 1
        // so it stays lower than div_items (3) forever, the loop continues
    }
}

q の値を設定するのではなく、その値を確認したい

if (q == 1) {
于 2013-08-28T08:57:56.873 に答える