仅在单击单选按钮1时启用文本框

时间:2014-02-13 11:06:56

标签: javascript html

我有2个单选按钮,即是和否。当我选择是时,文本框将启用。当我没有单击禁用文本框时。单击“是”时如何启用文本框。这是代码。请告诉我如何使用javascript启用和禁用它。

<script type="text/javascript">
$(function() {

    $("#XISubmit").click(function(){

        var XIyop= document.forms["XIForm"]["XIyop"].value;
        var XIForm = $('form[name=XIForm]');
        var XIAlmnus = XIForm.find('input[name=XIAlmnus]:checked').val();

        if (XIAlmnus == null || XIAlmnus == "") 
        {
            alert("Please select  Parent is an Alumnus (old Boy) of this school");
            return false;
        }
        document.getElementById("XIForm").submit();
    });
</script>        

<!-- html code-->
<html>
...
<label>Parent is an Alumnus (old Boy) of this school </label> &nbsp&nbsp
<input type='radio' name='XIAlmnus' value='Yes' id="XIyes"/>Yes
<input type='radio' name='XIAlmnus' value='No' id="XIno"/>No</td>

<label>If Yes, Year of passing </label> &nbsp&nbsp
<input type="textbox" name="XIyop" id="XIyop" >
...
</html>

5 个答案:

答案 0 :(得分:2)

我认为,您应该使用一些通用处理程序:http://jsfiddle.net/maximgladkov/MvLXL/

$(function() {
    window.invalidate_input = function() {
        if ($('input[name=XIAlmnus]:checked').val() == "Yes")
            $('#XIyop').removeAttr('disabled');
        else
            $('#XIyop').attr('disabled', 'disabled');
    };

    $("input[name=XIAlmnus]").change(invalidate_input);

    invalidate_input();
});

答案 1 :(得分:0)

首先禁用文本框。

<input type="textbox" name="XIyop" id="XIyop" disabled>    

点击单选按钮后,检查并启用它。

if(document.getElementById('XIyes').checked) {
     document.getElementById("XIyop").disabled = false;
    }else if(document.getElementById('XIno').checked) {
      document.getElementById("XIyop").disabled = true;
    }

答案 2 :(得分:0)

$(function() {
                $('input[name="XIAlmnus"]').on('change', function() {
                    if ($(this).val() == 'Yes') {
                        $("#XIyop").prop('disabled', false);
                    } else {
                        $("#XIyop").prop('disabled', true);
                    }
                });
            });

<input type="textbox" name="XIyop" id="XIyop" disabled>

答案 3 :(得分:0)

if(document.getElementById('XIyes').attr('checked')) {
    document.getElementById("XIyop").disabled = 'true';
} 

if(document.getElementById('XIno').attr('checked')) {
    document.getElementById("XIyop").disabled = 'false';
} 

答案 4 :(得分:0)

HTML:

<label>Parent is an Alumnus (old Boy) of this school </label> &nbsp&nbsp
<input type='radio' name='XIAlmnus' value='Yes' id="XIyes"/>Yes
<input type='radio' name='XIAlmnus' value='No' id="XIno"/>No
<br/>
<label>If Yes, Year of passing </label> &nbsp&nbsp
<input type="textbox" name="XIyop" id="XIyop" disabled>

JS:

document.getElementById('XIyes').onchange = displayTextBox;
document.getElementById('XIno').onchange = displayTextBox;

var textBox = document.getElementById('XIyop');

function displayTextBox(evt){
    if(evt.target.value=="Yes"){
        textBox.disabled = false;
    }else{
        textBox.disabled = true;
    }
}

请参阅工作演示here。谢谢,我希望这会对你有所帮助。