deshabilitar el cuadro de texto usando jquery?

Tengo tres botones de radio con el mismo nombre y valores diferentes.Cuando hago clic en el tercer botón de radio, la casilla de verificación y el cuadro de texto se desactivarán. Pero cuando elijo otros dos botones de radio, debe mostrarse.Necesito la ayuda en Jquery.Gracias en avanzar....

<form name="checkuserradio">
    <input type="radio" value="1" name="userradiobtn" id="userradiobtn"/> 
    <input type="radio" value="2" name="userradiobtn" id="userradiobtn"/>
    <input type="radio" value="3" name="userradiobtn" id="userradiobtn"/>
    <input type="checkbox" value="4" name="chkbox" />
    <input type="text" name="usertxtbox" id="usertxtbox" />
</form>

HTML

<span id="radiobutt">
  <input type="radio" name="rad1" value="1" />
  <input type="radio" name="rad1" value="2" />
  <input type="radio" name="rad1" value="3" />
</span>
<div>
  <input type="text" id="textbox1" />
  <input type="checkbox" id="checkbox1" />
</div>

Javascript

  $("#radiobutt input[type=radio]").each(function(i){
    $(this).click(function () {
        if(i==2) { //3rd radiobutton
            $("#textbox1").attr("disabled", "disabled"); 
            $("#checkbox1").attr("disabled", "disabled"); 
        }
        else {
            $("#textbox1").removeAttr("disabled"); 
            $("#checkbox1").removeAttr("disabled"); 
        }
      });

  });

No es realmente necesario, pero una pequeña mejora en el código de okw que haría que la llamada a la función sea más rápida (ya que está moviendo el condicional fuera de la llamada a la función).

$("#radiobutt input[type=radio]").each(function(i) {
    if (i == 2) { //3rd radiobutton
        $(this).click(function () {
            $("#textbox1").attr("disabled", "disabled");
            $("#checkbox1").attr("disabled", "disabled");
        });
    } else {
        $(this).click(function () {
            $("#textbox1").removeAttr("disabled");
            $("#checkbox1").removeAttr("disabled");
        });
    }
});

Este hilo es un poco antiguo pero la información debería actualizarse.

http://api.jquery.com/attr/

Para recuperar y cambiar propiedades DOM como el estado marcado, seleccionado o deshabilitado de los elementos del formulario, use el método .prop ().

$("#radiobutt input[type=radio]").each(function(i){
$(this).click(function () {
    if(i==2) { //3rd radiobutton
        $("#textbox1").prop("disabled", true); 
        $("#checkbox1").prop("disabled", true); 
    }
    else {
        $("#textbox1").prop("disabled", false); 
        $("#checkbox1").prop("disabled", false);
    }
  });
});

No estoy seguro de por qué algunas de estas soluciones usan .each (); no es necesario.

Aquí hay un código de trabajo que se deshabilita si se hace clic en la tercera casilla de verificación; de lo contrario, se elimina el atributo deshabilitado.

Nota: agregué una identificación a la casilla de verificación. Además, recuerde que los identificadores deben ser únicos en su documento, por lo tanto, elimine los identificadores de los botones de radio o hágalos únicos

$("input:radio[name='userradiobtn']").click(function() {
    var isDisabled = $(this).is(":checked") && $(this).val() == "3";
    $("#chkbox").attr("disabled", isDisabled);
    $("#usertxtbox").attr("disabled", isDisabled);
});

Sé que no es un buen hábito responder una pregunta antigua, pero estoy dando esta respuesta para las personas que verán la pregunta después.

La mejor manera de cambiar el estado en JQuery ahora es a través de

$("#input").prop('disabled', true); 
$("#input").prop('disabled', false);

Consulte este enlace para ver una ilustración completa. ¿Deshabilitar / habilitar una entrada con jQuery?

Lo hubiera hecho un poco diferente

 <input type="radio" value="1" name="userradiobtn" id="userradiobtn" />   
 <input type="radio" value="2" name="userradiobtn" id="userradiobtn" />    
 <input type="radio" value="3" name="userradiobtn" id="userradiobtn" class="disablebox"/>   
 <input type="checkbox" value="4" name="chkbox" id="chkbox" class="showbox"/>    
 <input type="text" name="usertxtbox" id="usertxtbox" class="showbox" />   

Aviso de atributo de clase

 $(document).ready(function() {      
    $('.disablebox').click(function() {
        $('.showbox').attr("disabled", true);           
    });
});

De esta manera, si necesita agregar más botones de opción, no debe preocuparse por cambiar el javascript

Supongo que probablemente desee vincular un evento de "clic" a varios botones de opción, leer el valor del botón de opción seleccionado y, según el valor, deshabilitar / habilitar una casilla de verificación o una casilla de texto.

function enableInput(class){
    $('.' + class + ':input').attr('disabled', false);
}

function disableInput(class){
    $('.' + class + ':input').attr('disabled', true);
}

$(document).ready(function(){
    $(".changeBoxes").click(function(event){
        var value = $(this).val();
        if(value == 'x'){
            enableInput('foo'); //with class foo
            enableInput('bar'); //with class bar
        }else{
            disableInput('foo'); //with class foo
            disableInput('bar'); //with class bar
        }
    });
});

Perdón por llegar tan tarde a la fiesta, pero veo que hay margen de mejora aquí. No se trata de "desactivar cuadro de texto", sino de la selección de radionbox y la simplificación del código, lo que lo hace un poco más a prueba de futuro, para cambios posteriores.

En primer lugar, no debe usar .each () y usar el índice para señalar un botón de opción específico. Si trabaja con un conjunto dinámico de botones de opción o si agrega o elimina algunos botones de opción posteriormente, ¡su código reaccionará con el botón incorrecto!

A continuación, pero ese no fue probablemente el caso cuando se hizo el OP, prefiero usar .on ('click', function () {...}) en lugar de click ... http: //api.jquery. com / on /

En primer lugar, pero no menos importante, también el código podría hacerse más simple y a prueba de futuro seleccionando el botón de opción en función de su nombre (pero que ya apareció en una publicación).

Así que terminé con el siguiente código.

HTML (basado en el código de okw)

<span id="radiobutt">
    <input type="radio" name="rad1" value="1" />
    <input type="radio" name="rad1" value="2" />
    <input type="radio" name="rad1" value="3" />
</span>
<div>
    <input type="text" id="textbox1" />
    <input type="checkbox" id="checkbox1" />
</div>

Código JS

$("[name='rad1']").on('click', function() {
    var disable = $(this).val() === "2";
    $("#textbox1").prop("disabled", disable); 
    $("#checkbox1").prop("disabled", disable); 
});

MVC 4 @ Html.CheckBoxPor lo general, la gente quiere actuar al marcar y desmarcar la casilla de verificación mvc.

<div class="editor-field">
    @Html.CheckBoxFor(model => model.IsAll, new { id = "cbAllEmp" })
</div>

puede definir la identificación de los controles que desea cambiar y en javascript hacer lo siguiente

<script type="text/javascript">
    $(function () {
        $("#cbAllEmp").click("", function () {
            if ($("#cbAllEmp").prop("checked") == true) {
                    $("#txtEmpId").hide();
                    $("#lblEmpId").hide();
                }
                else {
                    $("#txtEmpId").show();
                    $("#txtEmpId").val("");
                    $("#lblEmpId").show();
             }
        });
    });

también puede cambiar la propiedad como

$("#txtEmpId").prop("disabled", true); 
$("#txtEmpId").prop("readonly", true); 

$(document).ready(function () {
   $("#txt1").attr("onfocus", "blur()");
});

$(document).ready(function () {
  $("#txt1").attr("onfocus", "blur()");
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>

<input id="txt1">

obtenga el valor de los botones de radio y coincida con cada uno si es 3 y luego está desactivado checkbox and textbox.

$("#radiobutt input[type=radio]").click(function () {
    $(this).each(function(index){
    //console.log($(this).val());
        if($(this).val()==3) { //get radio buttons value and matched if 3 then disabled.
            $("#textbox_field").attr("disabled", "disabled"); 
            $("#checkbox_field").attr("disabled", "disabled"); 
        }
        else {
            $("#textbox_field").removeAttr("disabled"); 
            $("#checkbox_field").removeAttr("disabled"); 
        }
      });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<span id="radiobutt">
  <input type="radio" name="groupname" value="1" />
  <input type="radio" name="groupname" value="2" />
  <input type="radio" name="groupname" value="3" />
</span>
<div>
  <input type="text" id="textbox_field" />
  <input type="checkbox" id="checkbox_field" />
</div>