使用jquery將數組追加到查詢字符串

Question

我有一個包含作業詳細信息列表的表格，並且每個作業都帶有複選框，當我點擊 下一頁鏈接並選中複選框時，我應該使用複選框值和鏈接來獲取查詢字符串URL查詢字符串

<input type="checkbox" class="checkJobToSend" name="checkJOb" value="<TMPL_VAR NAME=job_id>" 
    <input type="checkbox" class="checkJobToSend" name="checkJOb" value="<TMPL_VAR NAME=job_id>" 
    <input type="checkbox" class="checkJobToSend" name="checkJOb" value="<TMPL_VAR NAME=job_id>" 
    <input type="checkbox" class="checkJobToSend" name="checkJOb" value="<TMPL_VAR NAME=job_id>" 
    <input type="checkbox" class="checkJobToSend" name="checkJOb" value="<TMPL_VAR NAME=job_id>" 


    <a href ='index.cgi?reqpage=$prev_page&job_category_id=$jobCategory' class='paginateAdmin' id='govtPaginate'>prevPage</a> 


    function getJobsChecked(){ 
      var arr = []; 
      var i= 0; 
      $('.checkJobToSend:checked').each(function(){ 
       arr[i++] = $(this).val(); 
      }); 

      return arr; 

     } 

      $(document).ready(function() { 

     $(document).on('click','.paginateAdmin', 
      function(e){ 
       e.preventDefault();  
      var arr = getJobsChecked(); 

       var post = $(this).attr("href"); 
       var array = post.split('?'); 
      var id=$(this).attr('id'); 




    $.post(
     'job.cgi', 
     array[1], 
     function(data,status){ 

      switch(id) 
      { 
       case "nonItPaginate": 

        $('#nonit').html(data); 

        break; 
       case "ItPaginate": 

         $('#it').html(data); 
         break; 
       case "govtPaginate": 

        $('#govt').html(data); 
        break; 
      default: 

    }  

     } 
    ); 

    }); 
    });  

我怎樣才能形成具有陣列將queryString [1]，並與檢查框值的像

reqpage=2&job_category_id=2&checkJob=1&checkJob=2&checkJob=3 

Answer 1

一個ARR不能有具有相同名稱的存在可以在多個參數只有一個參數checkJob。所以，你可以這樣做，而不是：

reqpage=2&job_category_id=2&checkJob=1,2,3 

這可以這樣實現：

// get checked values 
var checked = $('input[type="checkbox"].checkJobToSend:checked');  
var checkedValues = []; 
checked.each(function(i) { 

    // add checked values to our temporary list 
    checkedValues.push(checked[i].value);   
}); 

// create query param 
var queryParam = 'reqpage=2&job_category_id=2&checkJob=' + checkedValues.join(',');  

見工作示例：http://jsfiddle.net/amyamy86/GsSqc/

在您的服務器端代碼，那就要解釋checkJob=1,2,3 。

// in PHP 
$jobs = explode(",", $_GET["checkJob"]); 
echo $jobs[0]; // outputs value: 1 
echo $jobs[1]; // outputs value: 2 
echo $jobs[2]; // outputs value: 3 

你可以閱讀更多有關使用以下功能：

• :checked jQuery選擇：http://api.jquery.com/checked-selector/
• .join()：https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Global_Objects/Array/join

Answer 2

這將創建您的查詢字符串，並將其添加到散列（哈希部分不會在jsFiddle上工作，或者至少在URL中看不到它）：

的Javascript：

function getJobsChecked(){ 
      var arr = []; 
      var i= 0; 
      $('.checkJobToSend:checked').each(function(){ 
       arr[i++] = $(this).val(); 
      }); 
     return arr; 
     } 

$("#btn").on("click",function(){ 
    var arr = getJobsChecked(); 
    var qString = "reqpage=2&job_category_id=2"; 
    for(var i = 0; i<arr.length;i++) 
    { 
     qString+="&checkJob=" + arr[i]; 
    } 
    location.hash=qString; 
}); 

HTML：

<input type="checkbox" class="checkJobToSend" name="checkJOb" value="1" />1 
<input type="checkbox" class="checkJobToSend" name="checkJOb" value="4" />2 
<input type="checkbox" class="checkJobToSend" name="checkJOb" value="7" />3 
<input type="checkbox" class="checkJobToSend" name="checkJOb" value="12" />4 
<input type="checkbox" class="checkJobToSend" name="checkJOb" value="5" />5 
<input type="button" id="btn" value="Do It" /> 

的jsfiddle：​​