0

我目前正在编写一些 jQuery，它将检查某个 div 中的所有输入和选择元素是否有一个值集（不为空），然后一旦它们都有一个值，它将显示一个下一个按钮，然后在下一个滑动表格的一部分。

这是我的标记：

<div id="signupFormInner">
    <form action="/" method="post" id="form1">
        <div id="slide1">       
            <label for="title">Title:</label>
            <select name="title" id="title">
                <option value="">-- Please select --</option>
                <?php foreach($this->titles as $title) { ?>
                    <option value="<?php echo $title; ?>"><?php echo $title; ?></option>

                <?php } ?>
            </select>
            <label for="firstname">First Name:</label><input type="text" name="firstname" id="firstname" />
            <label for="lastname">Last Name:</label><input type="text" name="lastname" id="lastname" />
            <label for="email">Email Address:</label><input type="email" name="email" id="email" /><label for="email">Confirm Email Address:</label><input type="email" id="email_confirm" />

        </div>
        <div id="slide2">
            content in here

        </div>
        <div id="slide3">
            content in here

        </div>
    </form> 
</div>

我的表单中有三个 div，一旦 div 中的所有输入字段完成，它们就会滑过。这是尝试的jQuery：

jQuery('#signupFormInner input, #signupFormInner select').change(function(i, v) {
        var parentDivId = jQuery(this).parent().attr('id');
        jQuery("#" + parentDivId + " input, #" + parentDivId + " select").each(function(i2, v2) {
            if(jQuery(v2).attr('value') == "") {
                var completedInputs = false;
            } else {
                var completedInputs = true;
            }               
        });
        alert(completedInputs);
    });

我在这里要做的是，当用户更改表单的元素时，jQuery 将检查表单的该 div 中的所有其他元素是否也具有值，如果是，如前所述，它将允许它们按下一个按钮来滑动下一个 div，包含更多的表单元素。

如您所见，我将一个名为 completedInputs 的变量设置为 true 或 false ，具体取决于该 div 中的所有其他元素是否已完成，但我不断收到一条错误消息：

ReferenceError: completedInputs is not defined
[Break On This Error]   

alert(completedInputs);

我似乎无法解决这个问题，因为我定义了变量是真还是假，所以不确定为什么它说它是未定义的。

谁能看到我哪里出错了？谢谢

4

1 回答 1

2

范围问题 -completedInputs在您的外部定义.each()

var completedInputs;
jQuery("#" + parentDivId + " input, #" + parentDivId + " select").each(function(i2, v2) {
            if(jQuery(v2).attr('value') == "") {
                 completedInputs = false;
            } else {
                 completedInputs = true;
            }               
});
alert(completedInputs);
于 2013-05-10T13:24:53.583 回答