Как переключиться, ссылаясь на его состояние в Javascript - PullRequest
Новая
       10

Как переключиться, ссылаясь на его состояние в Javascript

0 голосов
/ 03 мая 2020

Интересно, как я могу переключить отображение относительно его состояния.

Когда я нажимаю кнопку запуска, выборка начнется.

Я хотел бы показать isfetching.. во время выборки, которая закомментирована оригинальная работа ниже.

Есть ли способ добиться этого?

Если есть какие-то полезные материалы, пожалуйста, дайте мне знать.

Спасибо 

var apikey="https://opentdb.com/api.php?amount=1&type=multiple";
$(".start").on("click",function(){
  fetch(apikey)
    .then(response => response.json())
    .then(json => {
      console.log(json);
    });
});
<!DOCTYPE html>
<html>
    <script src="https://code.jquery.com/jquery-3.3.1.js"></script>
    <head>
    </head>
    
    <body>
        <h1>Welcome</h1>
    <!--<h1>is fetching....</h1>-->
        <hr>
        <h2>Press the following button</h2>
    <!--<h2>Just a moment please</h2>-->
        
        <hr>
        
        <button type="button" class="start">Start</button>

        
    </body>
    <script type="text/javascript" src="main.js"></script>

</html>

1 Ответ

0 голосов
/ 03 мая 2020

Как это? 

var apikey="https://opentdb.com/api.php?amount=1&type=multiple";
$(".start").on("click",function(){
  $("#isFetch, #justAMoment").fadeIn()
  fetch(apikey)
    .then(response => response.json())
    .then(json => {
       $("#isFetch, #justAMoment").fadeOut(() => console.log(json))
    });
});
#isFetch, #justAMoment { display: none }



/* For snippet */
.as-console-wrapper { max-height: 3.5em !important; }
<!DOCTYPE html>
<html>
    <script src="https://code.jquery.com/jquery-3.3.1.js"></script>
    <head>
    </head>
    
    <body>
        <h1>Welcome</h1>
        <h1 id="isFetch">is fetching....</h1>
        <hr>
        <h2>Press the following button</h2>
        <h2 id="justAMoment">Just a moment please</h2>
        
        <hr>
        
        <button type="button" class="start">Start</button>

        
    </body>
    <script type="text/javascript" src="main.js"></script>

</html>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...