Функции Javascript не загружают данные при загрузке

Question

Функции Javascript не загружают данные при загрузке

0

У меня проблема с кодом, который я привел ниже, и я новичок в Javascript и JQuery. То, что должен делать код, - это загрузка, которую он набирает для "непрочитанных уведомлений", затем помещает это число в div, называемый note_number. Затем он должен прочитать номер из notes_number и в зависимости от того, будет ли число больше 0, он отобразит div, называемый notes_signal.

Я делаю это при загрузке каждые 5 секунд, а затем всякий раз, когда нажимается кнопка уведомлений. Код не работает, потому что при загрузке он не помещает число в div notes_number. Кроме того, другие случаи не работают. В какой-то момент я подумал, что это работает, но теперь я не могу понять, что. Здесь код:

//THIS IS TO CHECK WHEN THE PAGE COMES UP
$("#notes_number").load("getnumber.php");

if(document.getElementById("notes_number").innerHTML > 0){
var elem = document.getElementById("notes_signal");
elem.style.display = "";
}

if(document.getElementById("notes_number").innerHTML == 0){
var elem = document.getElementById("notes_signal");
elem.style.display = "none";
}


//THIS IS TO CHECK EVERY 5 SECONDS
window.setInterval(function(){
$("#notes_number").load("getnumber.php");

if(document.getElementById("notes_number").innerHTML > 0){
var elem = document.getElementById("notes_signal");
elem.style.display = "";
}

if(document.getElementById("notes_number").innerHTML == 0){
var elem = document.getElementById("notes_signal");
elem.style.display = "none";
}
}, 5000);



//THIS IS TO CHECK WHEN THE BUTTON IS PRESSED
function toggleDiv(divId) {
   $("#"+divId).show();

$(document).ready(function(){
   $("#myContent").load("getnotes.php?page=<? echo $page; ?>");
});



$("#notes_number").load("getnumber.php");

if(document.getElementById("notes_number").innerHTML > 0){
var elem = document.getElementById("notes_signal");
elem.style.display = "";
}

if(document.getElementById("notes_number").innerHTML == 0){
var elem = document.getElementById("notes_signal");
elem.style.display = "none";
}
}

user2362601 19 сен. 2013, в 23:24

Источник

Теги:

javascript

jquery

html

css

3 ответа

0

Я бы использовал .get в вашем экземпляре

var load = $.get('getnumber.php');

Kevin Lynch 19 сен. 2013, в 20:03

0

Вы имеете в виду вместо $("#notes_number").load("getnumber.php"); ?
user2362601 19 сен. 2013, в 21:25
0

Поскольку проблема в том, что запрос является асинхронным, вы должны объяснить, что $.get(...) и что нужно делать с этим результатом.
t.niese 19 сен. 2013, в 21:45

0

Javascript является асинхронным, что означает, что

if(document.getElementById("notes_number..... будет запущен раньше

$("#notes_number").load("getnumber.php"); выполнен.

Поэтому вы должны использовать обратный вызов следующим образом:

 $("#notes_number").load("getnumber.php",function(){
     if(document.getElementById("notes_number").innerHTML > 0){
        var elem = document.getElementById("notes_signal");
        elem.style.display = "";
        }

        if(document.getElementById("notes_number").innerHTML == 0){
        var elem = document.getElementById("notes_signal");
         elem.style.display = "none";
       }
  });

Также я не уверен, что это будет работать elem.style.display = "";

Попробуйте 'elem.style.display = "block"; вместо

andrew 19 сен. 2013, в 19:03

0

="" удаляет значение, которое было установлено непосредственно для элемента, поэтому оно будет иметь значение, которое снова будет получено из правил matchig css.
t.niese 19 сен. 2013, в 21:55

Ещё вопросы

Вы имеете в виду вместо $("#notes_number").load("getnumber.php"); ?
Поскольку проблема в том, что запрос является асинхронным, вы должны объяснить, что $.get(...) и что нужно делать с этим результатом.
="" удаляет значение, которое было установлено непосредственно для элемента, поэтому оно будет иметь значение, которое снова будет получено из правил matchig css.

untitled · Accepted Answer · 2013-09-19T19-26-00.000Z

Создайте функцию:

function checkNotes() {
    $.get( "getnumber.php", function( data ) {
        $( "#notes_number" ).text( data );
        if ( parseInt(data) > 0 ) {
            $('#notes_signal').show();
        } else {
            $('#notes_signal').hide();
        }
    });
}

И назовите его при загрузке, с интервалом и нажатием кнопки.

Есть ли способ автоматически скрыть #notes_signal и показать его при необходимости? Потому что сейчас он будет отображаться в течение полсекунды, а затем включается код, чтобы скрыть это. Спасибо за помощь!
в вашем CSS поместите #notes_number {display: none;} который будет скрывать его в первом случае
Создать правило CSS #notes_signal { display: none }