禁用/启用与单选按钮文本字段(jQuery的)(Disable/enable text field

2019-10-17 08:57发布

感谢过去帮助。 我再次问你。

我想有2个单选按钮,这将改变的状态的文本输入的(启用/禁用)。

我设法让来自残疾人启用,但问题是,当你在单选按钮之间进行切换,文本字段保持启用状态。 而且我不希望出现这种情况。

HTML是小提琴

$(document).ready( function(){
$('#casodhoda,#casodhoda1').prop('disabled',true);
$('input[type=radio][name=radioknof1]').click( function(){
$('#casodhoda,#casodhoda1').prop('disabled',true).val('');
$(this).next('span').children('wpcf7-form-control-wrap casodhoda').prop('disabled',false).triggerHandler('focus');
});
});

编辑,修改一点点的代码,并在任何方式不能去工作了解决方案。我想在负载情况下禁用输入字段,当用户点击电台应该同时启用,并专注于第一个输入字段。 该http://jsfiddle.net/wLFKD/3/在这里。 谢谢!

Answer 1:

彻底改变了按您的网站的HTML。 这应该工作:

$(document).ready( function(){
  $('#casodhoda,#casprihoda').prop('disabled',true);
  $('input[type=radio][name=radioknof]').click( function(){
    $('#casodhoda,#casprihoda').prop('disabled',true).val('');
    $(this).next('span').children('.wpcf7-form-control').prop('disabled',false).triggerHandler('focus');
  });
});

有一个错字。 如果这也不行,我能想到的唯一的另一种方法是......不,我认为这会工作。



Answer 2:

此标记:

<input type="radio" name="radioknof" value="text1"/>
<input type="text" id="id1" disabled="disabled"/><br/><br/>
<input type="radio" name="radioknof" value="text2"/>  
<input type="text" id="id2" disabled="disabled"/>​

这个脚本:

$('input[name="radioknof"]').on('click', function(){            
    $(this).next().prop('disabled',false).siblings('input[type=text]').prop('disabled',true);
});

结果你想要什么: http://jsfiddle.net/uefAK/



Answer 3:

心动不如行动,另一种解决方案, 不需要使用Javascript?

// HTML
<form>
    <div>
        <input id="trigger-1" type="radio" name="radioknof" value="text1"/>
        <label for="trigger-1"><input type="text" id="input-1" /></label>
    </div>
    <div>
        <input id="trigger-2" type="radio" name="radioknof" value="text2"/>
        <label for="trigger-2"><input type="text" id="input-2" /></label>
    </div>
</form>​


// CSS, but just for styling, it doesn't have functional meaning :)
form {padding: 2%}
div {margin: 1em 0}
input[type='radio'] {cursor: pointer;}​

http://jsfiddle.net/nUWcF/



文章来源: Disable/enable text field with radio button (jQuery)