JQuery установленное начальное значение

Question

Надеюсь, что вы можете мне помочь. Как установить начальное значение элемента в JQuery/Javascript?

Чтобы объяснить мою проблему, у меня есть следующий фрагмент. Мой фрагмент работает так, как я хочу, но только после «onclick». Когда я загружаю страницу, она не получит правильное значение. В этом случае я хочу захотеть, когда я нажму «показать ежемесячно», чтобы появиться 80 €, и когда я нажимаю «Показывать гость», чтобы появиться 800 евро. Но он работает только после нажатия кнопки, а не при загрузке страницы.

Благодаря

//Trying to set the initial value 
 
$(document).ready(function() { 
 
    $(".teste").ready(function() { 
 
     var initialVal = $(this).html(); 
 
if(initialVal !== "Show Monthly"){ 
 
    jQuery(".amountMonth").hide(); 
 
    jQuery(".amountAnnual").show(); 
 
}else{ 
 
    jQuery(".amountMonth").show(); 
 
    jQuery(".amountAnnual").hide(); 
 
}  
 
    }); 
 
}); 
 

 

 
//OnClick is working right 
 
$(document).ready(function() { 
 
    $(".teste").click(function(e) { 
 
     e.preventDefault(); 
 
     var initialVal = $(this).html(); 
 
     if(initialVal !== "Show Monthly"){ 
 
      $(".showAnnualMonthly a").text("Show Monthly"); 
 
      $(".perYearMonth").text("per year"); 
 
      jQuery(".monthlyOptions").hide(); 
 
      $("#arrowUpDown").removeClass("icon-up-arrow-button"); 
 
      $("#arrowUpDown").addClass("icon-down-arrow-button"); 
 
      jQuery(".amountMonth").hide(); 
 
      jQuery(".amountAnnual").show(); 
 
     } 
 
     else if (initialVal !== "Show Annual"){ 
 
      $(".showAnnualMonthly a").text("Show Annual"); 
 
      $(".perYearMonth").text("per month"); 
 
      jQuery(".monthlyOptions").show(); 
 
      $("#arrowUpDown").removeClass("icon-down-arrow-button"); 
 
      $("#arrowUpDown").addClass("icon-up-arrow-button"); 
 
      jQuery(".amountMonth").show(); 
 
      jQuery(".amountAnnual").hide(); 
 
     } 
 
    }); 
 
     
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<p class="amount amountAnnual" style="display:none">Annual --> 600€</p> 
 
<p class="amount amountMonth" style="dispay:none">Monthly--> 60€</p> 
 

 
<p class="showAnnualMonthly" id="showMonthlyOpt"> 
 
    <a href="" style="border:0; text-decoration:none;" class="teste">Show Monthly 
 
    <div class="row"> 
 
     <span id="arrowUpDown" class="icon-down-arrow-button changeArrow" style="color: rgba(0, 161, 204, 1); margin-bottom:30px; font-size:36px;"></span> 
 
    </div> 
 
    </a> 
 
</p>

Answer 1

Просто запустите код, который показывает и скрывает p элементы внутри $(document).ready() но вне обработчика щелчка. Нет необходимости в первой функции $(document).ready(); вы можете объединить их в один.