分裂陣列與函數聲明

Question

我只是詢問是否有可能以提醒內部數組文本中的每個複選框一樣，如果第一SOME TEXT檢查它會提醒第一陣列，如果第二排被檢查每個複選框它會提醒第二陣列等等等等

例如這是HTML

<div id="inside"> 
    <label><input type="checkbox">SOME TEXT</label><br/> 
    <label><input type="checkbox">SOME TEXT</label><br/> 
    <label><input type="checkbox">SOME TEXT</label><br/> 
    <label><input type="checkbox">SOME TEXT</label><br/> 
    <label><input type="checkbox">SOME TEXT</label><br/> 
    <label><input type="checkbox">SOME TEXT</label><br/> 
    <label><input type="checkbox">SOME TEXT</label><br/> 
</div> 

，這是腳本

jQuery(function(){ 
     var text = [ 
      "text 1", 
      "text 2", 
      "text 3", 
      "text 4", 
      "text 5", 
      "text 6", 
      "text 7" 
     ]; 

     jQuery("input[type='checkbox']").click(function(){ 
      var y = jQuery(this).closest(label); 
      jQuery(y).each(function(){ 
       if(jQuery(this).is(":checked")){ 

       display(text) //function called 

       } 
      }); 
     }); 
    }); 

和這個調用的函數

function display(x){ 
     var dis = ""; 
     for(var i = 0; i< x.length; i++){ 
      dis += alert(x[i]); 
     } 
     return dis; 
    } 

Answer 1

你可以得到選中的複選框的索引，那麼警報/在同一個索引記錄的項目。

jQuery(function($) { 
 
    var text = [ 
 
    "text 1", 
 
    "text 2", 
 
    "text 3", 
 
    "text 4", 
 
    "text 5", 
 
    "text 6", 
 
    "text 7" 
 
    ]; 
 

 
    var $checks = $("input[type='checkbox']").click(function() { 
 
    var idx = $checks.index(this); 
 
    display(text[idx]); 
 
    }); 
 
}); 
 

 

 
function display(x) { 
 
    console.log(x); 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="inside"> 
 
    <label> 
 
    <input type="checkbox">SOME TEXT</label> 
 
    <br/> 
 
    <label> 
 
    <input type="checkbox">SOME TEXT</label> 
 
    <br/> 
 
    <label> 
 
    <input type="checkbox">SOME TEXT</label> 
 
    <br/> 
 
    <label> 
 
    <input type="checkbox">SOME TEXT</label> 
 
    <br/> 
 
    <label> 
 
    <input type="checkbox">SOME TEXT</label> 
 
    <br/> 
 
    <label> 
 
    <input type="checkbox">SOME TEXT</label> 
 
    <br/> 
 
    <label> 
 
    <input type="checkbox">SOME TEXT</label> 
 
    <br/> 
 
</div>