當啓用JavaScript複選框時，啓用JavaScript按鈕

我需要禁用此按鈕，並且當用戶選中複選框時，它需要啓用，它根本不適用於我，按鈕保持禁用狀態，我知道onclick正在調用腳本，因爲我把警報在腳本和它提醒我....當啓用JavaScript複選框時，啓用JavaScript按鈕

<script type="text/javascript"> 
function goFurther(){ 

if (document.getElementById("ID").checked == true) 
document.getElementById("Calculate").disabled = false; 
else 
document.getElementById("Calculate").disabled = true; 
} 
</script> 

<style type="text/css"> 
input[disabled] 
{ 
    color:Gray; text-decoration:none; 
} 
</style> 



<CFOUTPUT query = "qGetOpenItemsTrans"> 
    <TR> 
     <TD ALIGN = "CENTER"> 
      <input type="checkbox" name = "chkbx" id='#ID#' value="#seq_claim_id#"   onClick="goFurther()" unchecked = 0 > 
     </TD> 
     <TD ALIGN = "CENTER">#Inventory_Date#</TD> 
     <TD ALIGN = "CENTER">#seq_claim_id#</TD> 
     <TD ALIGN = "CENTER">#Month_Closed#</TD> 
     <TD ALIGN = "CENTER">#Amount_Rcvd_by_FRG#</TD> 
     <TD ALIGN = "CENTER">#Commission_Amt#</TD> 
     <TD ALIGN = "CENTER">#Net_Recovery#</TD> 
    </TR>

<INPUT TYPE ="Button" NAME = "Calculate" VALUE = "Calculate" onClick = "FormSubmit();"  style="height:35px; width:150px; font-size:medium; font-weight:bold; color:green;" disabled >

來源

2014-10-08 Katherine Pacheco

可能重複（http://stackoverflow.com/questions/3858022/jquery-disabled-button-with-checkbox-issue） – 2014-10-08 18:06:57

除了你name屬性·需要替換（或添加）id attibute，你的函數也試圖獲得ID值爲id的元素。但是，您的ID通過查詢循環是動態的。將點擊元素本身傳遞給goFurther函數，以便直接引用checked元素。

<input type="checkbox" name="chkbx" id='#ID#' value="#seq_claim_id#" onClick="goFurther(this)" > 

<INPUT TYPE="Button" id="Calculate" VALUE="Calculate" onClick="FormSubmit();" style="height:35px; width:150px; font-size:medium; font-weight:bold; color:green;" disabled > 

    <script>function goFurther(elem){ 
if (elem.checked == true) 
document.getElementById("Calculate").disabled = false; 
else 
document.getElementById("Calculate").disabled = true; 
}</script>

您還可以進一步簡化功能，通過執行以下操作：

function goFurther(elem){ 
    document.getElementById("Calculate").disabled = !elem.checked; 
}

UPDATE：

要在造型問題。這是由於CSS的工作原理。您在CSS中定義了disabled樣式選擇器，但您的內嵌樣式設置爲color: green，該樣式選擇器將始終承擔所有定義的樣式表的工作。

<style> 
input#Calculate { 
    color:green; 
} 
input#Calculate[disabled] 
{ 
    color:Gray; text-decoration:none; 
} 
</style> 

<INPUT TYPE="Button" id="Calculate" VALUE="Calculate" onClick="FormSubmit();" style="height:35px; width:150px; font-size:medium; font-weight:bold;" disabled >

[與複選框問題的jQuery禁用按鈕]的

來源

2014-10-08 18:17:51

謝謝你這個工作完美唯一的事情，我不能得到按鈕的風格改變。取決於如果它的禁用我想它灰色風格 – 2014-10-08 18:24:20

查看更新的代碼。 – 2014-10-08 18:28:31

確保您徹底測試。該複選框有一個onClick事件，但可以導航html表單並僅使用鍵盤選中/取消選中複選框。 – 2014-10-08 18:33:29

要調用的document.getElementById（「計算」），但你的按鈕沒有一個「計算」的ID。

id="Calculate"

來源

2014-10-08 18:08:04 Seano666

好對象，我沒有補充說，但仍然會禁用當我選中複選框 – 2014-10-08 18:17:05

您是否在控制檯中出現Javascript錯誤？ – Seano666 2014-10-08 18:52:17

您似乎混淆了「name」和「id」屬性。

屬性「ID」給你訪問的元件（標籤）

屬性「名稱」定義了表格的子元素（如輸入，按鈕）的值的名稱。

在你的情況，你應該改變

... 
<input type="checkbox" name = "chkbx" id='ID' 
    onClick="goFurther(this); return false;"> 
... 


<script type="text/javascript"> 
function goFurther(self){ 
    document.getElementById("Calculate").disabled = !self.checked; 
} 
</script>

我想這種方式更容易閱讀（但仍未經測試）

<INPUT TYPE ="Button" ID = "Calculate" NAME = "Calculate" VALUE = "Calculate" 
onClick = "FormSubmit();" style="height:35px; width:150px; font-size:medium; 
font-weight:bold; color:green;" disabled >

來源

2014-10-08 18:14:57

當啓用JavaScript複選框時，啓用JavaScript按鈕

回答

相關問題