javascript - 如何限制用户应根据下拉响应为文本字段赋值？

Question

我有 2 个字段.. 一个是下拉选择框。第二个是文本框。在下拉列表中有 2 个值数字和 alpha。如果用户从下拉列表中选择 alpha 值，那么文本框应该只接受 alpha 值。如果用户选择数字，那么文本框应该只接受数字值。 .

这是我的示例代码..

<script>
    function isAlpha()
    {
        $("#Label").keypress(function (e) {
            if (e.which < 97 /* a */ || e.which > 122 /* z */) {
                e.preventDefault();
            }
        });
    }

    function isNumberKey(evt) {
        var charCode = (evt.which) ? evt.which : event.keyCode
        if (charCode > 31 && (charCode < 48 || charCode > 57))
            return false;
        return true;
    }

    function NumAlpha()
    {
        var Alpha_Numeric = document.getElementById('Attribute').value;

        if (Alpha_Numeric == 1)
        {
            isAlpha();
        }
        else
        {
            isNumberKey(evt);

        }
    }

</script>

<select  name="Attribute[]" class="required" id="Attribute" >
    <option selected  value="">Field Attribute</option>
    <option value="1">Alpha</option>
    <option value="2">Numeric</option>
</select>

<input type="text" name="Label[]" class="required" id="Label" onkeypress="return NumAlpha();"   onClick="field_length();" placeholder="Field Label" class="form-control">

在此代码概念中仅适用于 alpha.. 但它不适用于数值.. 请分享一些想法

Answer 1

试一试。

function change(evt){
	var dd=document.getElementById("slt1").value;
	if (dd == "a"){
	return ValidateAlpha(evt);
	}else{
	return isNumberKey(evt);
	}
}
function isNumberKey(evt){  <!--Function to accept only numeric values-->
    //var e = evt || window.event;
	var charCode = (evt.which) ? evt.which : evt.keyCode
    if (charCode != 46 && charCode > 31 
	&& (charCode < 48 || charCode > 57))
        return false;
        return true;
}		   
function ValidateAlpha(evt)
{
	var keyCode = (evt.which) ? evt.which : evt.keyCode
	if ((keyCode < 65 || keyCode > 90) && (keyCode < 97 || keyCode > 123) && keyCode != 32)
	 
	return false;
		return true;
}

<input id="txt1" type="text" onkeypress='return change(event);'></input>

<select onchange="document.getElementById('txt1').value=null;" id="slt1">
<option selected="selected" value="a">Alpha</option>
<option value="b">Numberic</option>
</select>