Jquery设置初始值

Question

希望你能帮助我。如何设置Jquery/Javascript中元素的初始值？

为了解释我的问题，我使用了以下代码片段。我的代码片段按我的意愿工作，但仅在 "onclick" 之后。当我加载页面时，它不会获得正确的值。在这种情况下，我希望当我单击 "show Monthly" 时显示 80€，当我单击 show Annual 时显示 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

只是运行显示和隐藏 $(document).ready() 内但在点击处理程序外的 p 元素的代码。不需要第一个$(document).ready()函数；你可以把它们合二为一。

Jquery设置初始值

Jquery set the initial value

javascript

jquery

onclick

domready