Откройте JQuery Accordion, используя кнопку ввода - PullRequest
Новая
       11

Откройте JQuery Accordion, используя кнопку ввода

0 голосов
/ 14 января 2012

Я создал аккордеон, и у него есть две проблемы:

  1. Я хочу, чтобы все разделы были закрыты на pageLoad
  2. Я хочу, чтобы первый раздел моготкрыть по нажатию кнопки ввода (которая уже выполняет другую функцию).

Я уже описал здесь , но это не сработало.

HTML-код выглядит следующим образом: 

<div id="AddInfo" >
        <h3><a href="#">You have ordered...</a></h3>
        <div id="summary" class="accordion">
        <p>Your basket is currently empty.</p>
        </div>
        <h3><a href="#">Payment Details</a></h3>
        <div id="payment" class="accordion" index="1">
        <form id="form1" name="form1" method="post" action="">
        <table>
            <tr>
             <td><label for"Name">Name on Card</label></td><td><input type="text" /></td>
            <tr>
                <td><label for"ccNo">Credit/Debit Card No</label></td>
                <td><input type="text" id="ccNo"/>
            </tr>
            <tr id="exp">
                <td><label for"Exp">Expiry Date</label></td>
              <td><label for "expMonth">Month</label><input type="text" id="expMonth"/>
              <label for "expYear">Year</label><input type="text" id="expYear"/></td>
              </tr>
             <tr>
             <td><label for"Type">Card Type</label></td>
             <td><select class="cardType">
                    <option value="Visa">Visa</option>
                    <option value="Mastercard">Mastercard</option>
                    <option value="American Express">American Express</option>
                 </select></td>
             <tr id="secCode">
             <td><label for"secCode">Security Code:</label></td><td><input type="text" id="secCode"/></td>
         </table>
         </form>
        </div>
        <h3 ><a href="#">Delivery Details</a></h3>
        <div id="delivery" class="accordion">
        <form id="delivForm">
            <table>
                <tr class="Name">
                    <td><label for"delName">Name:</label></td><td><input type="text" id="delName"/></td>
                 </tr>
                 <tr class="Address">
                    <td><label for"delName">Address:</label></td><td><input type="text" id="Add1"/></td>
                 </tr>
                 <tr class="Address">
                    <td></td><td><input type="text" id="Add2"/></td>
                    </tr>
                    <tr class="Address">
                    <td></td><td><input type="text" id="Add3"/></td>
                    </tr>
                    <tr class="Address">
                    <td></td><td><input type="text" id="Add4"/></td>
                    </tr>
                    <tr class="pCode">
                    <td><label for "pCode">Postcode:</label></td><td><input type="text" id="pCode"/></td>
                    </tr>
                 </tr>
             </table>
             <div>

Сценарий jQuery выглядит следующим образом: 

<script>
$(function() {
    $( "#AddInfo" ).accordion()
    });
</script>

Есть предложения?

Заранее спасибо!

1 Ответ

1 голос
/ 15 января 2012

Включите опции active и collapisble следующим образом ( обновленная демоверсия ): 

$("#accordion").accordion({
    collapsible: true,
    active: false,
    header: "h3"
});

И, честно говоря, дурно отвечать и принимать свой ответ, затем спросите это снова, потому что это действительно не работало.

...