Callback функция и глобальные переменные
Всем привет. Скажу сразу, что проблему вызовов асинхронных функций и считывания результатов из глобальных переменных я понимаю.
Но столкнулся с для меня непонятной проблемой. Суть проблемы: Есть некоторая callback функция (Web SQL) вызываемая в результате успешного завершения запроса к БД. Там я считываю данные и записываю в глобальные переменные: var totalSum = maxSum = 0; db.transaction( sql, [], function(tx, rs) { totalSum = rs.rows.item(0)['totalSum']; maxSum = rs.rows.item(0)['maxSum']; var button = document.getElementById('button'); button.setAttribute('onclick', 'checkMyVars();'); }, function(tx, err) {alert(err.message)} ); function checkMyVars() { alert('totalSum = ' + totalSum + ' maxSum = ' + maxSum); } Так вот после выполнения запроса к БД я при нажатии на кнопку получаю 0! А вот сам непонятный мне момент: Если вызывать функцию checkMyVars() в теле callback функции то получаю ожидаемые значения в глобальных переменных. В чем проблема мне непонятно ( Буду очень рад пояснениям ...:) |
<button type="button" id="button">button</button> <script> var totalSum = maxSum = 0; setTimeout(function() { totalSum = 1; maxSum = 2; var button = document.getElementById('button'); button.setAttribute('onclick', 'checkMyVars();'); }, 1000); function checkMyVars() { alert('totalSum = ' + totalSum + ' maxSum = ' + maxSum); } </script> Работает, только всё равно так, как вы делаете, делать точно не надо. :write: |
Nekromancer,
Спасибо, в этом случае действительно работает. Но у меня по прежнему не работает с моим случаем. Почему так делать не нужно, чем это чревато? как было было бы правильно ? Для меня досихпор остается загадкой тот факт, что при вызове var totalSum = maxSum = 0; db.transaction( sql, [], function(tx, rs) { totalSum = rs.rows.item(0)['totalSum']; maxSum = rs.rows.item(0)['maxSum']; var button = document.getElementById('button'); checkMyVars(); }, function(tx, err) {alert(err.message)} ); function checkMyVars() { alert('totalSum = ' + totalSum + ' maxSum = ' + maxSum); } Все отрабатывает как я и ожидаю, а вот в случае назначения обработчика var totalSum = maxSum = 0; db.transaction( sql, [], function(tx, rs) { totalSum = rs.rows.item(0)['totalSum']; maxSum = rs.rows.item(0)['maxSum']; var button = document.getElementById('button'); button.setAttribute('onclick', 'checkMyVars();'); }, function(tx, err) {alert(err.message)} ); function checkMyVars() { alert('totalSum = ' + totalSum + ' maxSum = ' + maxSum); } при нажатии на кнопку у меня переменные остаются не измененными. |
Ну примерно так:
(function() { var totalSum = 0, maxSum = 0; var button = document.getElementById('button'); button.onclick = checkMyVars; // либо сразу button.addEventListener('click', checkMyVars, false); db.transaction( sql, [], function(tx, rs) { totalSum = rs.rows.item(0)['totalSum']; maxSum = rs.rows.item(0)['maxSum']; }, function(tx, err) {alert(err.message)} ); function checkMyVars() { alert('totalSum = ' + totalSum + ' maxSum = ' + maxSum); } }()); |
Nekromancer, огромное СПАСИБО с
button.onclick = checkmyVars; заработало. Но в чем же проблема? Через setAttribute() получается обработчик как бы ранее связывается с элементом ??? |
drunia85,
даже не знаю, что там происходит с этой функцией, вообще так не стоит вешать события и однозначно, их нужно вешать заранее, а не потом, как было у вас. |
Часовой пояс GMT +3, время: 03:37. |