簡體   English   中英

復選框選中時,也應使文本框也啟用,否則禁用

[英]Checkbox when checked, should make a textbox too enable else disable

我編寫了以下代碼,該代碼在選中復選框時啟用了一個文本框。 該代碼正在處理一個小的缺陷。 這是我們第一次執行該文本框,無論該復選框處於選中狀態還是未選中狀態。 但是經過幾次,代碼仍可以正常工作。 請幫助我找到錯誤。

<html>
<head>
    <title>SHOP ALL</title>
        <link rel="stylesheet" type="text/css" href="style.css">
        <script language="javascript" src="addcart.js"></script>
        <script type="text/javascript">
            function enableDisable(bEnable, textBoxID)
            {
                document.getElementById(textBoxID).disabled = !bEnable
            }
        </script>
</head>
     <body>
<form>
        <table align="center"  width="100%" cellpadding="50px">
            <tr>
                <th> TICK ON THE THINGS YOU NEED </th>
                <th> PRODUCT </th>
                <th> DESCRIPTION </th>
                <th> NO OF ITEMS </th>
            </tr>
            <tr>
                <td><input type="checkbox" name="shoe" onclick="enableDisable(this.checked, '0')"></td>
                <td><img src="images/1.jpg" alt="shoe1" width="180px" height="200px"></td>
                <td><h4>-------</h4></td>
                            </tr>
                        --------------
 </body>
</html`>

您應該輸入以下代碼:

    <script type="text/javascript">
        function enableDisable(bEnable, textBoxID)
        {
            document.getElementById(textBoxID).disabled = !bEnable
        }
    </script>

在關閉主體之前,或者准備在DOM上調用它。 這樣,即使在復選框和文本字段存在之前,代碼也將被執行。

默認情況下,文本輸入處於啟用狀態,因此您可能還需要將復選框設置為選中狀態。

這是一個工作版本:

<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
</head>
<body>
  <input type="text" id="txtBox" />
  <input type="checkbox" id="chkbox" onchange="document.getElementById('txtBox').disabled=!this.checked;" checked="checked" />
</body>
</html>

和演示: http : //jsbin.com/ulemim/2

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM