Jquery 单步执行表单，因为所有输入都在一行中完成

----

我正在设计一个类似于向导的表单，引导用户完成每个输入，并且在所有输入都被寻址之前不允许它们继续

当且仅当当前行中的所有输入都已填写或选中时，我希望显示表中的下一行。行可以包含任意数量的文本输入、复选框或无线组

以下是我当前的代码：

<table>
    <tr>
        <td><input type="text"></td>

        <td><input type="radio"></td>
    </tr>

    <tr style="display:none">
        <td><input type='radio'></td>

        <td><input type='checkbox'></td>
    </tr>

    <tr style="display:none">
        <td><input type='text'></td>

        <td><input type='text'></td>
    </tr>
</table>​

---

当用户在第一行的文本框中键入时，这将显示下一行，但他们还必须选中单选按钮。此外，它将显示表中的所有行，而不仅仅是下一行。

问题在于这里

$（“table tr”）。下一行（“tr”）。每一行（…

您正在为

$（“表tr”）

中的每一行选择所有下一行。若要修复此问题，请将

.next（“tr”）

移动到

each（）中

这里是简化的问题在这里
$（“表tr”）。下一个（“tr”）。每个（…

您正在为
$（“表tr”）
中的每一行选择所有下一行。若要修复此问题，请将
.next（“tr”）
移动到
each（）中

这里是简化的
我会做：

实际上，大多数函数都可以进行一些简化，但我这样编写，这样您就可以很容易地看到它在做什么。
我会这样做：

实际上，大多数函数都可以简化，但我这样写是为了让您可以很容易地看到它在做什么。
在函数（）之前{…}？so$（“table tr”）。每个（next（“tr”）函数（curIdx，curEntity）{…}？这似乎很奇怪。你不是说完全删除它吗？each中不需要它，each将在下一次迭代中自动转到下一个…不不不不…你必须在传递给
each（）的函数中调用
curEntity
或
this
（在该上下文中是相同的）
。你能编辑这把小提琴吗？在你和凯文之间，我有点迷路了。@PaoloBergantino它现在在函数（）之前做（{…}？所以$（“table tr”）。每个（next（“tr”）函数（curIdx，curEntity）{…}？这似乎很奇怪。你不是说完全删除它吗？each中不需要它，each将在下一次迭代中自动转到下一个…不不不不…你必须在传递给
each（）的函数中调用
curEntity
或
this
（在该上下文中是相同的）
。你能编辑这把小提琴吗？在你和凯文之间，我有点迷路了。@PaoloBergantino现在可以了，但以我的实际形式（我为问题简化了情况），它似乎在第二排被抓住了。想法？@jon:我想这是我计算单选按钮的方式……嗯。是因为它希望检查整个组吗？@jon是的，试试这个：-如果你可能在一排中有多组收音机，它会变得更复杂一点，这个版本应该允许这样做。工作正常！始终存在一些奇怪的条件，因此我可能只是将其更改为每行只需要填写/检查一个输入。非常感谢您的帮助。这是有效的，但以我的实际形式（我针对问题简化了情况），它似乎在第二排被抓住了。想法？@jon:我想这是我计算单选按钮的方式……嗯。是因为它希望检查整个组吗？@jon是的，试试这个：-如果你可能在一排中有多组收音机，它会变得更复杂一点，这个版本应该允许这样做。工作正常！始终存在一些奇怪的条件，因此我可能会将其更改为每行只需要填写/检查一个输入。非常感谢您的帮助。
function refreshCascadingLists() {
    // Get an array of tr's
    // Loop thorugh each and see if it should be shown based on it's predecessors status
    var prevHadUnselected = false;
    $("table tr").next("tr").each(function(curIdx, curEntity) {
        if (prevHadUnselected) {
            $(this).fadeOut();
        } else {
            $(this).fadeIn();
        }

        prevHadUnselected = false;
        $(this).find(":input").each(function(curSelIdx, curSelEntity) {
            if ($(curSelEntity).val() == "" && $(curSelEntity).not(":checked")) 
                prevHadUnselected = true;
        });
    });
}

$(document).ready(function() {
    $(":input").bind('keyup change', function() {
        refreshCascadingLists();
    });
});​

function refreshCascadingLists($tr) {
    var all_filled = true;
    $tr.find(':input').each(function() {
        if($(this).is('input[type=radio], input[type=checkbox]')) {
            if(!$(this).is(':checked')) {
                all_filled = false;    
            }
        } else if($(this).val() == '') {
            all_filled = false;
        }
    });

    var $next_tr = $tr.next('tr');    
    if(all_filled) {
        if(!$next_tr.is(':visible')) {
            $next_tr.fadeIn(function() {
                refreshCascadingLists($(this));                    
            });    
        }
    } else {
        $tr.nextAll('tr').hide();
    }
}

$(document).ready(function() {
    $(":input").bind('keyup change', function() {
        refreshCascadingLists($(this).closest('tr'));
    });
});​