2

如果有人选择A为 , 显示 javascripts 的选项A1，并且如果他们选择为 , A2,显示 javascripts ，我想制作一个 javascript 来显示。因此，它会首先从选择标签中询问和BA3BB1B2B3A

例如：

<select name="AorB" >
<option value="" selected="selected">Select...</option>
<option value="A" >Option A</option>
<option value="B" >Option B</option>
</select>

我正在使用这种 javascript 方式（错误警报）：

<SCRIPT language=JavaScript>
<!--
function check(form) {
if (form.Password.value == "")
{ alert("Please enter your Password."); form.Password.focus(); return;}
if (form.Password.value.length < 8)
{ alert("Please enter a valid Password."); form.Password.focus(); return;}
form.submit()
}
//-->
</SCRIPT>

PS：当他们选择 A 来获得 B 选项 javascripts 或反向时，我不想使复杂化。

添加 - 解释：我的意思是如果我们选择 OPTION A 将会显示一些 Input-s ....并且 javascript 将只询问显示的 input-s 所以这意味着 OPTION A input-s ...但不要求选项 B 也输入-s，即使它们没有显示，因为我们没有选择选项 B ...我希望我为你解释了一点。

4

2 回答 2

0

select您可以通过以下方式轻松检查标签的当前值：

alert(document.getElementById('AorB').value);

这将提醒select标签的当前值。

然后，只要值随onChange事件发生变化，您就可以检查该值：

<select id="AorB" onchange="alert(document.getElementById('AorB').value);">
<option value="" selected="selected">Select...</option>
<option value="A" >Option A</option>
<option value="B" >Option B</option>
</select>

这是您可以使用的 jsFiffle 示例。

然后你可以根据值是什么来做一些 JavaScript，不过我不会给你写整个代码。

我希望这有帮助！

于 2012-11-07T23:42:41.290 回答
0

我对您的问题的理解是您想要一个选择框，这将决定表单上显示哪些字段。然后，您希望验证脚本仅验证显示的那些字段。这最好用 JQuery 处理。这是一些工作代码来举例，还有一个fiddle。

HTML

<div id="wrapper">
    <form id="myForm" name="myForm" method="POST" action="http://www.google.com">
        <select id="option" name="option">
            <option value="X">Choose One...</option>
            <option value="A">Option A</option>
            <option value="B">Option B</option>
        </select>
        <div id="optionset-a">
            <p>
                Input A1: <input name="a1" id="a1" class="option-a" type="textfield" /><br     />
                Input A2: <input name="a2" id="a2" class="option-a" type="textfield" /><br />
                Input A3: <input name="a3" id="a3" class="option-a" type="textfield" /><br />
            </p>
        </div>
        <div id="optionset-b">
            <p>
                Input B1: <input name="b1" id="b1" class="option-b" type="textfield" /><br     />
                Input B2: <input name="b2" id="b2" class="option-b" type="textfield" /><br />
                Input B3: <input name="b3" id="b3" class="option-b" type="textfield" /><br />
            </p>
        </div>
        <input type="submit" id="submit-button" name="submit" value="Submit" />
    </form>
</div>​

jQuery

$('#optionset-a').hide();
$('#optionset-b').hide();
$('#submit-button').hide();

$('#option').change(function() {
    if ($('#option').val() == 'A') {
        $('#optionset-b').hide();
        $('#optionset-a').show();
        $('#submit-button').show();
    } else if ($('#option').val() == 'B') {
        $('#optionset-a').hide();
        $('#optionset-b').show();
        $('#submit-button').show();
    }
});

$('#submit-button').click(function() {
    var validation = true;
    if ($('#option').val() == 'A') {
        $('.option-a').each(function() {
            if ($(this).val() == '') {
                $(this).css('border','1px solid red');
                validation = false;
            }
        });
    }
    if ($('#option').val() == 'B') {
        $('.option-b').each(function() {
            if ($(this).val() == '') {
                $(this).css('border','1px solid red');
                validation = false;
            }
        });
    }
    if (validation) {
        document.forms["myForm"].submit();
    } else { alert('Please fill in all fields.'); }
});​
于 2012-11-08T00:38:37.803 回答