禁用动态创建的文本框

问题描述：

我正在动态创建文本框和单选按钮，并从数据库中获取字段。对于我的任务，我需要通过使用javascript勾选单选按钮来禁用某些文本框。但单选按钮始终可见。例如，如果我点击第一个单选按钮，它应该禁用第二个和第三个文本框，而不是单选按钮。禁用动态创建的文本框

我怎么能实现这个使用JavaScript？

将[无效]（http://www.w3.org/TR/DOM-Level-2-HTML /html.html#ID-50886781）相关输入元素的属性设置为true。 – RobG

@RobG回答这个问题的答案 – Varun

你可以参考这个 http://*.com/questions/1648901/disable-textbox-using-jquery –

答

HTML：

<input type='radio' name='r1' value="NE" /> 
<input type='radio' name='r1' value="NW" /> 
<input type='radio' name='r1' value="SE" /> 

<input type='textbox' id="txt1" name='txt1' value="NE"/> 
<input type='textbox' id="txt2" name='txt2' value="NW"/> 
<input type='textbox' id="txt3" name='txt3' value="SE"/>

的JavaScript：

// First assign onclick handler to your radio buttons 
// Note - this is just a demo. You should encapsulate 
// this loop in a page onload initialization method. 
var radios = document.forms[0].elements["r1"]; 
for(var i = 0; i < radios.length; i++) { 
    radios[i].onclick = DisableTextBoxes; 
} 

// Disable textboxes based on respective radio click 
function DisableTextBoxes(){  
    var textboxes = [ 
    document.getElementById("txt1"), 
    document.getElementById("txt2"), 
    document.getElementById("txt3")] 

    for(var i = 0; i < radios.length; i++) { 
    if(radios[i].checked) { 
     textboxes[i].disabled = false; 
    } else { 
     textboxes[i].disabled = true; 
    } 
    } 
}

更详尽的解释可以发现。

答

如果您使用的是jQuery，则可以使用:text或input[type=text]选择器来选择文本框进行操作。

例如，禁用紧跟一个复选框第一个文本框：

<input type="checkbox" name="check1" id="check1" value="Yes"> 
<input type="text" id="txt1" name="txt1"> 

<script type="javascript"> 
$("#check1").change(function(){ 
    if($(this).is(':checked')) 
     $(this).next(":text").attr('disabled','true'); 
    else 
     $(this).next(":text").removeAttr('disabled'); 
}); 
</script>

禁用动态创建的文本框

相关推荐