Question

如果我选择A，B，C输入字段不是mandotory.If我选择C，测试输入框应该是强制性的。我试过但它不起作用。

HTML：

<select name="test" id="select" onclick="selection()">
<option value="">A</option> 
<option value="B">B</option>
<option value="C">C</option>
<option value="nil">nil</option>
    </select> 
<td>test</td>                           
<td><input type="text" name="test1" id="test1" />
 <input type="button" value="submit" onclick="selection()" />

JS：

function selection()
{
 var cat = document.getElementById('select').value;
    if (cat == "nil") {
        if (document.getElementById("test1").value == "") {
            alert('Mandatory');

        }

    }
}

Answer 1

使用onchange事件进行选择。 Working jsFiddle here

<强> HTML

<select name="test" id="select" onchange="selection()">
<option value="">A</option> 
<option value="B">B</option>
<option value="C">C</option>
<option value="nil">nil</option>
    </select> 
<td>test</td>                           
<td><input type="text" name="test1" id="test1" />
 <input type="button" value="submit" onclick="selection()" />

<强>的Javascript

function selection()
{    
 var cat = document.getElementById('select').value;    
    if (cat == "nil") {
        if (document.getElementById("test1").value == "") {
            alert('Mandatory');
            return false;
        }

    }
    return true;
}

<强> Working Demo Here

Answer 2

您应该使用onchange代替onclick和if (cat == "C")代替if(cat == "nil")

＆＃13;

function selection()
{
 var cat = document.getElementById('select').value;
    if (cat == "C") {
        if (document.getElementById("test1").value == "") {
            alert('Mandatory');
        }
    }
}

＆＃13;

<select name="test" id="select" onchange="selection()">
    <option value="">A</option> 
    <option value="B">B</option>
    <option value="C">C</option>
    <option value="nil">nil</option>
</select> 

<td>test</td>                           
<td><input type="text" name="test1" id="test1" onchange="selection()" />
    <input type="button" value="submit" onclick="selection()" />

＆＃13;

此外，您需要使用input onchange="selection()"来检测用户是否在选择c时清除了输入。

Answer 3

<html>
<head>
    <title></title>
</head>
<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.11.1.min.js"></script>

<body>

    <script>
 $(document).delegate("#select","change",function(e){
        if ($(this).val() === 'C')
            $('#save').attr('onclick','chk()');

        else
           $('#save').removeAttr('onclick');
    });
 function chk()
 {
    var name=$('#name').val();

    if(name=="")
    {
        alert("Mr. Hussy Please fill this box");

    }
 }
</script>

<select name="test" id="select">
<option value="">A</option> 
<option value="B">B</option>
<option value="C">C</option>
<option value="nil">nil</option>
    </select> 
<td>test</td>                           
<td><input type="text" name="test1" id="name" />
 <input id='save' type="button" value="submit" />
    </body>
</html>

根据下拉选择强制输入字段

3 个答案: