通過複選框啓用和禁用文本框數組

我想要的是當相應的複選框被選中時啓用的文本框。但是當應用功能沒有任何反應:(

在我的代碼

文本和複選框被動態地從數據庫使用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

通過複選框啓用和禁用文本框數組

回答

相關問題