Не могу получить значение с помощью функции, возвращает пустое значение

Question

Я хочу, чтобы он отображал div, относящийся к вкладке, если он = 1, или скрывал его, если он = 0.

Сценарий:

function blah(){
 loadtab('a');
 loadtab('b');
 loadtab('c');
}

var page = cheese

function loadtab(tab){
    $('#'+tab).hide();
    $('#'+tab).load("devices/" + page + ".html " + "#" + tab);
        var tabcontent = $("#"+tab).text();
        alert(tab); //works
        alert(tabcontent); //doesn't
        if (tabcontent == "1"){
            $('#'+tab).show();
        }
        else{
            $('#'+tab).hide();
        }
}

* переменная, определенная в предыдущем коде

HTML на cheese.html:

<div id="a">0</div>
<div id="b">0</div>
<div id="c">1</div>

Вкладка Alerting дает a, b и c в отдельных предупреждениях. Оповещение TabContent дает пустое предупреждение. Почему это?

Answer 1

Похоже, вы получаете текст до того, как метод загрузки завершит заполнение вкладки. Попробуйте выполнить свой код в обратном вызове .load.

$('#'+tab).load("devices/" + page + ".html " + "#" + tab, function(){ 
   var tabcontent = $("#"+tab).text();
    alert(tab); //works
    alert(tabcontent); //doesn't
    if (tabcontent == "1"){
        $('#'+tab).show();
    }
    else{
        $('#'+tab).hide();
    }
});

Кстати, вам, вероятно, следует кэшировать $('#'+tab), поскольку вы часто используете его в этой функции.

Чтобы кэшировать ваш селектор, просто сделайте это.

 var $tab = $('#'+tab);  // store your jQuery object into a variable 
 $tab.hide();
 $tab.load("devices/" + page + ".html " + "#" + tab);
     var tabcontent = $tab.text();
     alert(tab); //works
     alert(tabcontent); //doesn't
     if (tabcontent == "1"){
         $tab.show();
     }
     else{
         $tab.hide();
     }

Это просто улучшает производительность, так как jQuery не должен продолжать искать в DOM вкладку, вы просто сохраняете ссылку на нее в другой переменной в начале вашей функции.

Answer 2

попробуйте сделать это:

function loadtab(tab){
    $('#'+tab).hide();
    $('#'+tab).load("devices/" + page + ".html " + "#" + tab, function() {
        var tabcontent = $("#"+tab).text();
        alert(tab); //works
        alert(tabcontent); //doesn't
        if (tabcontent == "1"){
            $('#'+tab).show();
        }
        else{
            $('#'+tab).hide();
        }
    });
}