Question

我之前已经这样做了，但由于某种原因，这次不能正常工作，而且我已经盯着它看了很长时间以至于我几乎可以保证我永远不会发现问题...

我有一大堆HTML，它创建了一个表单。

<div class="paymentForm">               

    <span class="pgHeading" style="margin: 30px 0;">Payment Information</span>
    <div class="inputRedTemplate paymentType inputRoundedTop" onclick="javascript:displayPaymentFields()">
        <div class="label">Credit Card</div>
    </div>

    <div class="inputRedTemplate paymentType">
        <div class="label">Cash</div>
    </div>

    <div class="inputRedTemplate paymentType inputRoundedBottom" onclick="">
        <div class="label">Check</div>
    </div>

    <div id="cashPaymentBlock">
        <span>For cash payments, bills higher than $20 will not be accepted.</span>
    </div>

    <div id="ccPaymentBlock">
        <span class="ccDisclaimer" style="margin: 30px 0;">
           Your credit card transaction will be processed by your store location and you must
           present your credit card to the driver at the time the store delivers your order for a
           credit imprint and your signature.
        </span>

        <input id="card_name" name="cardName" class="inputRedTemplate inputFullWidth" placeholder="Cardholder Name" />
        <input id="card_number" name="cardNumber" class="inputRedTemplate inputFullWidth" placeholder="Card Number" onkeypress="return checkNumbers(event,this)" />
        <div class="error" id="err_msg" style="display: none;">Numbers only!</div>

        <input id="card_type" name="cardType" class="inputRedTemplate inputFullWidth inputRoundedBottom" placeholder="Credit Card Type" />
        <input id="card_expire_month" name="cardExpireMonth" class="inputRedTemplate gcNumber" placeholder="2 Digit Expiration Month" />
        <input id="card_expire_year" name="cardExpireYear" class="inputRedTemplate gcPin" placeholder="4 Digit Year" />
        <input id="card_zip" name="cardZip" class="inputRedTemplate inputFullWidth inputRoundedBottom" placeholder="Billing ZIP Code" />
    </div>
    <div class="btnRedTemplate btnFullWidth checkoutBtn floatLeft" style="margin-top:30px;" onclick="" title="Submit Button" />Submit</div>
</div>

我有以下脚本：

<script>
    $(document).ready( function () {
        hideAllPaymentBlocks();
    })

    function hideAllPaymentBlocks() {
      $('#cashPaymentBlock').hide();
      $('#ccPaymentBlock').hide();
      // add line for checks, too
    }    

    function displayPaymentFields() {
        $('ccPaymentBlock').show();  
    }

</script>

hideAllPaymentBlocks函数在ready函数中正确运行，但单击Credit Card div时似乎没有运行displayPaymentFields。没有错误;它只是没有做任何事情。谁能指出我正确的方向？就像我说的那样，我现在已经盯着这一段时间了，我确信这是一个很容易解决但我不能让我的大脑工作的。

Answer 1

您忘记了哈希$('#ccPaymentBlock').show();

在div中使用onclick函数来显示/隐藏另一个div

1 个答案: