如何檢查複選框，如果它的值存在於文本區域

我有一些複選框和一個文本區域，並收集文本區域中的所有複選框值，然後插入它在數據庫中，當我從數據庫中選擇數據時，我只有文本區域的數據而不是複選框。我想要的東西是：當我查看它們時，必須檢查之前檢查過的複選框。現在我可以如何檢查複選框的值是否存在於文本區域，然後選中該複選框？我的代碼在這裏？如何檢查複選框，如果它的值存在於文本區域

     <div style="margin-top:50px;"> 
          <div style="margin-top:-30px;"> 
           <h4>Header Options</h4><br> 
           <table style="width:70%;float:left"> 
            <tbody> 
             <tr> 
              <td><input type="checkbox" id="h_option1" name="h_option1" value="Company Name"> Company Name </td> 
              <td><input type="checkbox" id="h_option2" name="h_option2" value="Company Address"> Company Address</td> 
              <td><input type="checkbox" id="h_option3" name="h_option3" value="Month"> Month</td> 
              <td> <input type="checkbox" id="h_option4" name="h_option4" value="Name"> Name </td> 
             </tr> 
             <tr> 
              <td> <input type="checkbox" id="h_option5" name="h_option5" value="Employee Ref No"> Employee Ref No </td> 
              <td><input type="checkbox" id="h_option6" name="h_option6" value="Designation"> Designation </td> 
              <td><input type="checkbox" id="h_option7" name="h_option7" value="Date of joining"> Date of joining </td> 
             </tr> 
            </tbody> 
           </table> 
           <div> 
            <span> 
             <textarea readonly="" type="text" id="header_options" name="header_options" rows="5" cols="25">Company Name,Company Address,Month,Employee Ref No,</textarea> 
            </span> 
           </div> 
          </div> 
          <br> 
          <br> 
          <div align="center"> 
           <input type="button" value="Configure" class="detailsbutton" onclick="get_check_value();"> 
          </div> 
          <br> 
         </div>

這是我希望得到的結果是： the expected result ，但它給了我下面的結果： the current result

注：我複選框的每個值分開與文本區域內一個逗號。

來源

2015-04-07 Barakat Ali Foroz

你能提供的功能* get_check_value（）*的代碼？問題應該在這裏。 – Tolokoban

var options = document.getElementById('header_options').value; 
options = options.split(','); 
for(var i = 0; i < options.length; i++){ 
//Set "checked" for element where the value is the current value in options array 
    if(options[i]) document.querySelectorAll('input[value="'+options[i]+'"][type="checkbox"]')[0].checked = true; 
}

Fiddle

來源

2015-04-07 12:15:38 alexP

首先，你必須創建一個存在於textarea中的所有複選框的數組，然後你必須使用複選框的id來檢查相應數組中存在哪些複選框值。然後根據isExist函數的結果設置選中和取消選中

來源

2015-04-07 12:10:01

雖然您可以在服務器端代碼（PHP，JSP或任何您使用的技術）上做得更好，但是如果您真的想在客戶端執行此操作，那麼這是純JavaScript中的一種方式（適用於幾乎所有現代瀏覽器版本）。

創建一個功能選擇複選框，

<script type="text/javascript"> 
function selectChkbox() { 
    var strAllValues = document.getElementById('header_options').value; // Contains all values 
    var chkboxArr = document.getElementsByTagName('input'); 
    for(var i=0; i<chkboxArr.length; i++) { 
    if(chkboxArr[i].type == 'checkbox') { 
     if(strAllValues.indexOf(chkboxArr[i]) != -1) { // check if checkbox value is present in all values 
      chkboxArr[i].checked = true; 
     } 
    } 
    } 
} 
</script>

調用此函數頁面加載時。就像這樣：

<body onload="selectChkbox();">

希望它能幫助，謝謝。

來源

2015-04-07 12:13:35 BabyDuck

如何檢查複選框，如果它的值存在於文本區域

回答

相關問題