bugfix> javascript > 投稿

これが今厄介なコードです

if(!IsActive) {
        IsActive = true;
        $('#Submit').prop('disabled', true);
        var icheckBoxes = $('input[type="checkbox"]');
        for(var i=0; i < icheckBoxes.length; i++) {
            if(!icheckBoxes.eq(i).is(":checked")) { 
                $('.checkbox'+i).css('color','#ff0000');
            }
            IsActive = false;
            $('#Submit').prop('disabled', false);   
        }
        var sture = $('#sture').val().trim();
        if (sture.length < 3) {         
            $('#sture').parents('.form-group').addClass('has-error');   
            var errormsg = "Check the Page";
            swal('',errormsg,'warning');    
            IsActive = false;
            $('#Submit').prop('disabled', false);           
            return false;
        }
        swal({
              title: "Processing",
              text: "",
              html: true,
              showCancelButton:false,
              showConfirmButton:false,
              allowOutsideClick:false
        }); 
        var values = $('#Form').serialize();
        $.post('/processing/page.html', values, function(data){
            if ( data.status == 1) {
            } 
            else { 
                IsActive = false;
                $('#Submit').prop('disabled', false);
                return false;
            }
        },"JSON");      
    }

これで、チェックされていない場合は基本的にすべてのチェックボックスのテキストを強調表示し、ページの処理を停止する必要がありますが、最初のチェックボックスで停止し、読み上げてから前進しません。

ここで何が間違っているのか分かりません

回答 2 件
  • opacity の例を次に示します  cssプロパティ、試してみてください

    function highlight() {
      $('input[type="checkbox"]').each(function() {
         if (!$(this).is(":checked")) {
          $(this).css('opacity', '1');
        } else {
          $(this).css('opacity', '0.5');
        }
      });
    }
    setInterval(() => highlight(), 1500);
    
    
    .checkbox1,
    .checkbox2,
    .checkbox3,
    .checkbox4 {
      height: 4em;
      width: 4em;
    }
    
    
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <input type="checkbox" class="checkbox1" />
    <input type="checkbox" class="checkbox2" />
    <input type="checkbox" class="checkbox3" />
    <input type="checkbox" class="checkbox4" />
    
    


    そして、ここで $.each() とバージョン  読むのが簡単です

    function highlight() {
      $('input[type="checkbox"]').each(function() {
        if (!$(this).is(":checked")) {
          $(this).css('opacity', '1');
        } else {
          $(this).css('opacity', '0.5');
        }
      });
    }
    setInterval(() => highlight(), 1500);
    
    
    .checkbox1,
    .checkbox2,
    .checkbox3,
    .checkbox4 {
      height: 4em;
      width: 4em;
    }
    
    
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <input type="checkbox" class="checkbox1" />
    <input type="checkbox" class="checkbox2" />
    <input type="checkbox" class="checkbox3" />
    <input type="checkbox" class="checkbox4" />
    
    

  • コードを編集しました。このリンクを確認してください:http://jsfiddle.net/5V288/1539/

       var icheckBoxes = $('input[type="checkbox"]'); 
        icheckBoxes.each(function(index){  
        if(!$(this).is(":checked")) {                                      
        $('.checkbox'+index).css('outline','2px solid #c00');
        }
                $('#submit').prop('disabled', false);   
        });
    
    

あなたの答え