어떻게 쿼리 문자열 변수를 기반으로 Jquery show() hide() 테이블 행을 사용할 수 있습니까?

Question

몇 가지 작업이있는 방문 페이지가 있습니다. 액션은 기본적으로 숨겨져 있고 사용자가 액션 제목을 클릭 할 때 열리는 테이블 행 내에 있습니다. 쿼리 문자열 변수를 기반으로 표시/숨김을 제어하려고합니다.

예를 들어 작업 중 하나가 "전화 요청"입니다. 사이트의 다른 페이지에는 전화를 요청할 수있는 링크가 있습니다. 사용자가 해당 링크를 클릭하면 '통화 요청하기'행이 표시된 방문 페이지로 이동하게됩니다.

Answer 1

this article 및 CMS'sexcellent answer에서 similar question까지의 닉네임이 많이 있습니다.

showRow라는 쿼리 문자열 변수를 사용하여 표시 할 행의 ID를 전달합니다 (매우 정교하지만 좋은 시작점이 아님).

게재하며 요청 된 행에 대해 jQuery를 사용하여 :

<table> 
    <thead> 
    <tr> 
     <th>col 1</th> 
    </tr> 
    </thead> 
    <tbody> 
    <tr id="row1" style="display: none;"> 
     <td>this is row 1</td> 
    </tr> 
    <tr id="row2" style="display: none;"> 
     <td>this is row 2</td> 
    </tr> 
    </tbody> 
</table> 

<script type="text/javascript"> 
    $(document).ready(function() { 
     var row = getQueryString()["showRow"]; 
     if (row !== undefined) $("table tr#" + row + "").show(); 
    }); 

    getQueryString = function() { 
     var assoc = []; 
     var keyValues = unescape(location.search.substring(1)).split('&'); 
     for (var i in keyValues) { 
      var key = keyValues[i].split('='); 
      assoc[key[0]] = key[1]; 
     } 
     return assoc; 
    } 
</script> 

Answer 2

필요한 처리를 생성하기 위해 일부 서버 측 처리를 수행하지 마십시오. 서버 측 언어를 언급하지 않은 것처럼 즉 당신이 할 수있는 RAW PHP를 사용하여 :

<? 
$showRow = ""; 
switch($_GET['title']) 
{ 
    case "call": 
    //$showRow is the id of the row to be shown 
    $showRow ="call" 
    break; 
} 
?> 

...rest of page.... 

<script type="text/javascript"> 
    $(document).ready(function() { 
    //show the row 
    $("#<?=$showRow;?>").show(); 
    }); 
</script> 

또한 행의 ID가 스위치에 대한 필요성을 절감 할 수있는 URL 인수로 설정할 수 있습니다. 또한 URL 인수가 표시되지 않으면 jquery가 행을 표시하지 않도록 일부 null 테스트를 수행해야합니다.