通过复选框启用和禁用文本框数组

我想要的是当相应的复选框被选中时启用的文本框。但是当应用功能没有任何反应:(

在我的代码

文本和复选框被动态地从数据库使用PHP生成这里是我的代码：

<div><div class="ac-container"> 

<div id="accordion"> 

<?php 

$qry="SELECT * FROM catalog"; 
$result= mysql_query($qry); 
if($result){ 
while($info = mysql_fetch_array($result)) 
{ 

print "<h3><a href=\"\#\"> cat:".$info['name']."</a></h3><div>"; 

$qryitem="SELECT * FROM item WHERE Id=". $info['Cid']; 
$resultitem=mysql_query($qryitem); 
if($resultitem){ 

?> 

<form name="form1" id="form" method="post" action="manage_item_action.php" > 
<?php 
while($info=mysql_fetch_array($resultitem)) 
{ 
?> 
<input type="checkbox" id="checkB" name="op[]" value="<?php echo $info['Id'];?>" /> <?php echo $info['name'];?> 
<label> Quantity <input disabled="disabled" id="textB" type="text" 
name="Quantit[]" value="<?php echo $info['Quantity'];?>"/> 
</label> 
<script> 



checkBoxes=document.form1.elements['op[]']; 
textBoxes=document.form1.elements['Quantit[]']; 
for(var i=0 ; i<checkBoxes.length;i++){ 
checkBoxes[i].onchange = function() { 
textBoxes[i].disabled =!(this.checked);}; 


} 

</script> 



<br/> 

     <?php 
     } 
    } 


else echo "There are no items."; 

print "</div>"; 



} 
} 


?> 

</div> 

<input type="submit" value="update" name="submit"/> 
<input type=reset value="clear"></td></tr> </form>

来源

2012-04-10 proG

这是你到达那里一些草率的代码。你的循环让你最终得到一堆带有结束标签的重复JavaScript。 – 2012-04-10 00:14:23

对不起，我没有得到你所说的“一堆重复的JavaScript全部结束标记”。 – proG 2012-04-10 00:18:56

你可以发布它创建的呈现的HTML吗？ – 2012-04-10 00:20:09

您遇到的问题是，。您的事件处理程序中的变量i没有被定义为了克服这个问题，你可以将属性添加到每个复选框以保存他们指的是什么指数：

checkBoxes=document.form1.elements['op[]']; 
textBoxes=document.form1.elements['Quantit[]']; 
for(var i=0 ; i<checkBoxes.length;i++) 
{ 
    checkBoxes[i].myIndex = i; 
    checkBoxes[i].onchange = function() { 
     textBoxes[this.myIndex].disabled =!(this.checked); 
    }; 
}

其他方法解决这个问题：http://www.howtocreate.co.uk/referencedvariables.html

你的代码仍然相当混乱。例如，您正在生成太多关闭<div/>-标记与您的第一个print -statement。我建议你只从你的问题中删除PHP代码，因为问题只与html和javascript有关。

我也建议使用库来操作DOM元素，如jQuery。

在编写和调试javascript时，您应该始终确保您收到错误消息。 “没有任何反应”表示你只是忽略了错误。对于Firefox下载插件Firebug。 Safari还具有可在设置中激活的开发人员工具。使用这些工具可以很容易地发现并解决这样的问题。

来源

2012-04-10 01:00:58 Basti

非常感谢！它与我合作！并感谢您对jQuery DOM元素的评论 – proG 2012-04-10 06:53:21

通过复选框启用和禁用文本框数组

回答

相关问题