Javascript，对象之间的依赖关系

我的表单上有checkbox1，checkbox2，checkbox3，textbox1和textbox2。Javascript，对象之间的依赖关系

默认情况下，只有checkbox1处于活动状态。当我点击（选中）复选框1时，复选框2被激活。当我点击（选中）复选框2时，复选框3被激活。最后，当我检查checkbox3时，textbox1和textbox2被激活。

而当我取消选中checkbox3时，两个文本框都被禁用。带有取消选中状态的复选框2会禁用复选框3。

如何维护这些对象之间的依赖关系？例如，当我取消选中复选框1时，复选框2和3以及两个文本框应该禁用。

2011-05-24 rysiard

如果您使用复选框和输入框的DOM元素，那么我会说只是在复选框和输入框元素中添加一个用户定义的属性。有些东西一样

<input type="checkbox" name="vehicle" value="Bike" dependents="inputbox1,inputbox2" />

和的onclick你可以在你的事件处理程序访问该属性像

arrDependents = element.getAttribute("dependents").split(",");

这将返回所有相关的ID为阵列。

来源

2011-05-24 15:18:55 user160820

这是一个可能的解决方案。在这种情况下，我会在禁用时取消选中复选框。如果这不是期望的，根据需要进行更改：

HTML：

Checkbox 1: <input id="checkbox1" type="checkbox" onchange="onCheckbox1Changed();"/> 
Checkbox 2: <input id="checkbox2" type="checkbox" onchange="onCheckbox2Changed();"/> 
Checkbox 3: <input id="checkbox3" type="checkbox" onchange="onCheckbox3Changed();"/> 
Textbox 1: <textarea id="textbox1"></textarea> 
Textbox 2: <textarea id="textbox2"></textarea> 
<script type="text/javascript"> 
    //Initialize checkboxes 
    onCheckbox1Changed(); 
    onCheckbox2Changed(); 
    onCheckbox3Changed(); 
</script>

的JavaScript

var onCheckbox1Changed = function(checkbox){ 
    var checkbox1 = document.getElementById('checkbox1'); 
    var checkbox2 = document.getElementById('checkbox2'); 

    if(checkbox1.checked){ 
     checkbox2.disabled = false; 
    } else { 
     if(checkbox2.checked){ 
      checkbox2.click(); 
     } 
     checkbox2.disabled = true; 
    } 
}; 

var onCheckbox2Changed = function(checkbox){ 
    var checkbox2 = document.getElementById('checkbox2'); 
    var checkbox3 = document.getElementById('checkbox3'); 

    if(checkbox2.checked){ 
     checkbox3.disabled = false; 
    } else { 
     if(checkbox3.checked){ 
      checkbox3.click(); 
     } 
     checkbox3.disabled = true; 
    } 
}; 

var onCheckbox3Changed = function(checkbox){ 
    var checkbox3 = document.getElementById('checkbox3'); 
    var textbox1 = document.getElementById('textbox1'); 
    var textbox2 = document.getElementById('textbox2'); 

    var disabled = !(checkbox3.checked); 
    textbox1.disabled = disabled; 
    textbox2.disabled = disabled; 
};

来源

2011-05-24 15:52:38 Briguy37

Javascript，对象之间的依赖关系

回答

相关问题