jQuery .hide работает, но .show не работает

Question

У меня есть таблица, которую мне нужно показать и спрятать до 9 tr таблицы в группах по 3. У меня есть цикл по одному tr 9 раз, чтобы получить все 9. Шкура работает, но .show делает not И jquery не работает на полпути (я поставил alert () по всему коду и даже использовал alert (), чтобы показать, какого посетителя я пытаюсь показать или скрыть, и значения верны.

вот фрагмент, который создает tr's

<cfloop index="i" from="1" to="9" step="1">


        <tbody id="attendeeRow<cfoutput>#i#</cfoutput>">
        <tr>
          <td colspan="2" bgcolor="#693505">
            <table width="600" border="0" align="center" cellpadding="4" cellspacing="0">
                <tr>
                  <td colspan="2">&nbsp;</td>
                </tr>
                <tr>
                  <td width="185" align="right">*Attendee <cfoutput>#i#</cfoutput> Name<br /></td>
                  <td><span id="sprytextfield100<cfoutput>#i#</cfoutput>">
                    <input name="attendeeName<cfoutput>#i#</cfoutput>" type="text" class="form" size="35" value="" />
                    <span class="textfieldRequiredMsg"></span></span></td>
                </tr>
                <tr>
                  <td align="right">*Attendee <cfoutput>#i#</cfoutput> Title<br /></td>
                  <td><span id="sprytextfield101<cfoutput>#i#</cfoutput>">
                    <input name="attendeeTitle<cfoutput>#i#</cfoutput>" type="text" class="form" size="35" value="" />
                    <span class="textfieldRequiredMsg"></span></span></td>
                </tr>
                 <tr>
                  <td align="right">*Attendee <cfoutput>#i#</cfoutput> Company</td>
                  <td><span id="sprytextfield102<cfoutput>#i#</cfoutput>">
                    <input name="attendeeCompany<cfoutput>#i#</cfoutput>" type="text" class="form" size="35" value="" />
                    <span class="textfieldRequiredMsg"></span></span></td>
                </tr>
                <tr>
                  <td align="right">*Attendee <cfoutput>#i#</cfoutput> Email</td>
                  <td><span id="sprytextfield103<cfoutput>#i#</cfoutput>">
                  <input name="attendeeEmail<cfoutput>#i#</cfoutput>" type="text" class="form" size="35" value="" />
                  <span class="textfieldRequiredMsg"></span><span class="textfieldInvalidFormatMsg"></span></span></td>
                </tr>

            </table>
          </td>
        </tr>
        </tbody>
        </cfloop>

        <!---- comment: this bottom part is what allows the user to show or hide the elements, I just use the div with an id="counter" to keep track of where I am.--->
        <tr>
            <td colspan="2" align="center" bgcolor="#693505" class="form">
                <div id="counter" style="visibility:hidden;">0</div>
                <div id="additional3">[+] Click here to register an additional 3 attendees</div>
                <div id="subtract3">[+] Click here to remove the last 3 attendees</div>
            </td>
        </tr>

А вот и jquery;

$(document).ready(function () {

for (loopIndex = 1; loopIndex <= 9; loopIndex++)
{

    var currentRow = "attendeeRow" + loopIndex;

    var currentName = "attendeeName" + loopIndex;
    var currentTitle = "attendeeTitle" + loopIndex;
    var currentCompany = "attendeeCompany" + loopIndex;
    var currentEmail = "attendeeEmail" + loopIndex;



    $("#"+currentRow).hide();

    $("#"+currentName).val("--");
    $("#"+currentTitle).val("--");
    $("#"+currentCompany).val("--");
    $("#"+currentEmail).val("a@b.c");

}


$("#subtract3").hide(); 
$("#additional3").show();

$("#additional3").live("click", function(e) {

    e.preventDefault();

    var start = $("#counter").text(); 
    var increment = "3";
    var end = parseInt(start) + parseInt(increment); 


    for (loopIndex = start; loopIndex <= end; loopIndex++)
    {
        var currentRow = "attendeeRow" + loopIndex;

        var currentName = "attendeeName" + loopIndex;
        var currentTitle = "attendeeTitle" + loopIndex;
        var currentCompany = "attendeeCompany" + loopIndex;
        var currentEmail = "attendeeEmail" + loopIndex;

        alert("#"+currentRow);
        $("#currentRow").show();

        $("#"+currentName).val("");

        $("#"+currentTitle).val("");

        $("#"+currentCompany).val("");
        $("#"+currentEmail).val("");

    }
    $("#counter").text(end);
    if(start >= 6){
        $("#additional3").hide();

    }
    if(start >= 3){
        $("#subtract3").show();

    }

});

$("#subtract3").live("click", function(e) {

    e.preventDefault();

    var end = $("#counter").text(); 
    var increment = "3";
    var start = parseInt(start) - parseInt(increment); 


    for (loopIndex = start; loopIndex <= end; loopIndex++)
    {
        var currentRow = "attendeeRow" + loopIndex;

        var currentName = "attendeeName" + loopIndex;
        var currentTitle = "attendeeTitle" + loopIndex;
        var currentCompany = "attendeeCompany" + loopIndex;
        var currentEmail = "attendeeEmail" + loopIndex;



        $("#"+currentRow).hide();

        $("#"+currentName).val("--");
        $("#"+currentTitle).val("--");
        $("#"+currentCompany).val("--");
        $("#"+currentEmail).val("a@b.c");

    }
    $("#counter").text(start);


    if(start >= 6){
        $("#additional3").hide();

    }
    if(start >= 3){
        $("#subtract3").show();
    }

});
});

Answer 1

Я предполагаю, что это ...

alert("#"+currentRow);
$("#currentRow").show();

предназначен для этого ...

alert("#" + currentRow);
$("#" + currentRow).show();

Вы предупреждаете объединение, но не делаете объединение для выбора DOM.

Answer 2

В вашем событии #subtract3 произошла ошибка копирования-вставки.

var start = parseInt(start) - parseInt(increment); 

должно быть

var start = parseInt(end) - parseInt(increment);

Кроме того, вы можете использовать .click() вместо .live("click", поскольку эти элементы не заменяются.