Блог

Главная - Вопросы по программированию - .show() работает некорректно

.show() работает некорректно

#javascript #jquery #html

#javascript #jquery ( jquery ) #HTML

Вопрос:

У меня возникли проблемы с приложением, которое я создаю. В зависимости от того, является ли моя переменная нулевой, должен отображаться определенный экран. Как только к этой переменной будет добавлено значение, мое приложение должно отображать другой div. Однако мой код не работает. Взгляните на Javascript / Jquery ниже:

(Обратите внимание на изменение кода, чтобы показать, что null не является проблемой)

 access_token = 3; 

   if (access_token == 3){
        $('.dashboardProfile').hide();
        $('.dashboardInfo').hide();
        $('.dashboardConnect').show();

    $('.connect').click(function () {
        var url = "https://foursquare.com/oauth2/access_token";
        url  = "?client_id="   foursquareApi.clientId;
        url  = "amp;response_type=token";
        url  = "amp;redirect_uri="   foursquareApi.redirectUrl;

        window.location = url;
    });
}
else {
    $('.dashboardProfile').show();
    $('.dashboardInfo').show();
    $('.dashboardConnect').hide();
}

и это тот HTML, о котором идет речь:

 <div class="dashboard-container">
    <div class="dashboardConnect">
        <div class="connect">
            <p>Sign In</p>
        </div>
    </div>
    <div class="dashboardProfile">
        <p>User Information and Picture</p>
    </div>
    <div class="dashboardInfo">
        <p>Check Ins</p>
        <div class="indicator checkin">#</div>
        <p>Countries</p>
        <div class="indicator country">#</div>
        <p>Cities</p>
        <div class="indicator city">#</div>
    </div>
</div>
</div>
<!--container-fluid-->

Это заголовок HTML:

 <head>
    <title>FourSquare Dashboard</title>
    <link rel="stylesheet" href="main.css">
    <script src="http://code.jquery.com/jquery-latest.min.js"></script>
    <script src="FourSquareJax.js"></script>
</head>

Комментарии:

1. Я протестировал это, и это работает. devdoodle.net/dev/155

2. @NobleMushtak интересно. Я работаю над этим на Github, и это не работает, а консоль ничего не говорит: almontas.github.io/FourSquareJax

Ответ №1:

Легко исправить. Вы допустили небольшую опечатку. Поместить $('.dashboardConnect').hide(); внутрь else цикла:

 var access_token = 3;
if (access_token == 3) {       
    $('.dashboardProfile').hide();   
    $('.dashboardInfo').hide(); 
    $('.dashboardConnect').show();   
    $('.connect').click(function() {   
        var url = "https://foursquare.com/oauth2/access_token";
        url  = "?client_id=" foursquareApi.clientId;
        url  = "amp;response_type=token";
        url  = "amp;redirect_uri=" foursquareApi.redirectUrl;
        window.location = url;
    });
}
else {
    $('.dashboardProfile').show();   
    $('.dashboardInfo').show();
    $('.dashboardConnect').hide();
}

Комментарии:

1. Я знаю, что сейчас в вопросе то же самое, но это потому, что кто-то другой отредактировал его.

2. Я почти уверен, что так оно и есть. Я сделал devdoodle.net/dev/155 таким образом, он имитировал файл Github, и причина, по которой он не работал в вашем файле Github, заключалась в этой опечатке. @Almontas

Ответ №2:

Попробуйте изменить условие на:

 if (!access_token)

Это приведет к вводу условного блока, если access_token значение равно null, не определено, является пустой строкой или 0 .

Метки: