Значение переменной не очищается

Этот код отображает проанализированные данные из php. Проблема заключается в том, что при выборе другого набора данных, которые были проанализированы, предыдущие данные не очищаются. Я попытался опорожнить var json, но без какого-либо положительного результата.Значение переменной не очищается

$(document).ready(function() { 
$(".chooseSub").on("click",function(event) { 
    event.preventDefault(); 
    var display = $(this).attr("title"); 
    var idx = 0; 
    $.post("includes/learnFunctions.php", { 
     learnThis:display 
    }, function(data) { 
     var json = $.parseJSON(data); 
     if (json == 0) { 
      $("#spanQ").html("Nothing to show!"); 
     } else { 
      workData(json, idx); 
     } 
    }); 
}); 

function workData(json, idx){ 
    function next() {    
     if (idx > (json.length - 1)) { 
      idx = 0; 
     } 
     console.log(idx+" next() start");   
     var text1 = json[idx].question; 
     var text2 = json[idx].answer; 
     $("#spanQ").html("<p>" + text1 + "</p>"); 
     $("#spanA").html("<p>" + text2 + "</p>"); 
     console.log(idx,text1,json); 
     console.log(json);   
     idx++; 
    } 
    $(".test").on("click",function(){ 
     next(); 
    }); 
} 

}); //doc ready

эта проблема может быть смоделировано здесь

<!doctype html> 
<html lang="en"> 
<head> 
    <meta charset="utf-8"> 
    <title>test</title> 
    <script src="js/jquery-1.10.2.js"></script> 
<script> 
$(document).ready(function() { 
    function workData(custVar){ 
     var idx =0; 
     function again(){ 
      console.warn(custVar); 
      if (idx > (custVar.length - 1)) { 
       idx = 0; 
      }   
      var text1 = custVar[idx]; 
      $("#spanQ").html("<p>" + text1 + "</p>"); 
      console.log(idx,text1,custVar);   
      idx++; 
     } 
     $("#id4").on("click",function(){  
      again(); 
     }); 
    } 
    var customVar1 = ["green", "black", "red", "blue", "yellow"]; 
    var customVar2 = ["one","two", "three", "four", "five"]; 
    $("#id1").on("click", function(){ 
     workData(customVar1); 
    }); 
    $("#id2").on("click", function(){ 
     workData(customVar2); 
    }); 
}); //doc ready 
</script> 
</head> 
<body> 
    <div id="id1">Colors</div> 
    <br/> 
    <div id="id2">Numbers</div> 
    <br/> 
    <div id="id4">RUN</div> 
    <br /> 
    <span id="spanQ"></span>        
</div>       
</body> 
</html>

Я попытался несколько различных подходов, но ни один из них не работает для интервальной сценария.

$(document).ready(function() { 
    var idx = 0; 
    function workData(custVar){  
     clearInterval(myInterval); 
     function again(){ 
      if (idx > (custVar.length - 1)) { 
       idx = 0; 
      }   
      text1 = custVar[idx]; 
      $("#spanQ").html("<p>" + text1 + "</p>"); 
      console.log(idx,text1,custVar); 
      idx++; 
     } 
     var myInterval = setInterval(again, 2000); 
    } 
    function manStep(custVar){ 
     if (idx > (custVar.length - 1)) { 
      idx = 0; 
     }   
     text1 = custVar[idx]; 
     $("#spanQ").html("<p>" + text1 + "</p>"); 
     console.log(idx,text1,custVar); 
     idx++; 
    }; 
    var customVar1 = ["green", "black", "red", "blue", "yellow"]; 
    var customVar2 = ["one","two", "three", "four", "five"]; 
    $("#id1").on("click", function(){ 
     workData(customVar1); 
    }); 
    $("#id2").on("click", function(){ 
     workData(customVar2); 
    }); 
    $("#id3").on("click", function(){ 
     clearInterval(interval); 
     var interval = setInterval(function(){manStep(customVar1);}, 2000); 
    }); 
    $("#id4").on("click", function(){ 
     clearInterval(interval); 
     var interval = setInterval(function(){manStep(customVar2);}, 2000); 
    }); 
}); //doc ready

источник

2014-01-09 david.gol

Вы уверены, что это не проблема кеширования? – adeneo

Вы протестировали результаты запроса ?. пользователь Chrome на вкладке сети, чтобы узнать, что ваш запрос отправляет/принимает. – Ricbermo

у вас может быть больше одного элемента управления с классом «chooseSub». Пожалуйста, просмотрите его –

Если добавить обработчик событий с $(".test").on("click", ...), это не вызывает каких-либо предыдущих обработчики должны быть удалены. Вместо этого каждый пробег workData() регистрирует дополнительное действие, которое необходимо выполнить при нажатии на элемент .test. Вот почему вы видите столько выходных логов, сколько были сделаны вызовы workData().

Чтобы избавиться от этой проблемы, перед добавлением нового следует удалить любой существующий обработчик событий "click". jQuery предлагает функцию off() для этой цели:

var test = $(".test"); 
test.off("click"); 
test.on("click", ...); 
// or: test.off("click").on("click", ...)

источник

2014-01-09 21:41:48 denisw

Спасибо, что хорошо работало при использовании .on («click»), но как я могу исправить ту же проблему, когда это выполняется через setInterval (runFunction, timeOut); где нет обработчика только функции? –

'setInterval' возвращает идентификатор, который может использоваться для удаления интервала обратного вызова с помощью' clearInterval'. См. [Соответствующие документы в MDN] (https://developer.mozilla.org/en-US/docs/Web/API/window.setInterval?redirectlocale=en-US&redirectslug=DOM%2Fwindow.setInterval). – denisw

Я проверил clearInterval, но не повезло, PLS см. Выше. –

Значение переменной не очищается

ответ

Смежные вопросы