2011-11-01 7 views
1

방금 ​​여기에서 다른 질문을했습니다 : global variable and reduce database accesses in PHP+MySQL PHP + MySQL을 사용하고 있습니다. 이 페이지는 데이터베이스에 액세스하고 모든 항목 데이터를 검색하여 나열합니다. 새 페이지를 열 계획 이었지만 이제는 자바 스크립트를 사용하여 팝 div를 보여주고 싶습니다. 그러나 나는 새로운 div에서 PHP의 변수를 활용하는 방법을 모른다. 각각 $ iteminfo 두 값 $의 C1 및 C2 $를 가지고자바 스크립트에서 PHP 변수를 사용합니다

<html> 
</head> 
<script type="text/javascript"> 
function showDiv() { 
    document.getElementById('infoDiv').style.visibility='visible'; 
} 
function closeDiv() { 
    document.getElementById('infoDiv').style.visibility='hidden'; 
} 
</script> 
</head> 
<body> 
<ul> 
<?php foreach ($iteminfos as $iteminfo): ?> 
    <li><a href="javascript:showDiv()"><?php echo($iteminfo['c1']); ?></a></li> 
<?php endforeach;?> 
</ul> 
<div id="infoDiv" style="visibility: hidden;"> 
    <h1><?php echo($c1) ?></h1> 
    <p><?php echo($c2) ?></p> 
    <p><a href="javascript:closeDiv()">Return</a></p> 
</div> 
</body> 
</html> 

"iteminfos"는 데이터베이스로부터의 결과이다 : 다음 코드이다. "infoDiv"에서 선택한 항목의 세부 정보를 표시하려고합니다. 그렇게하는 방법?

도움 주셔서 감사합니다.

추가 질문 : 예를 들어 $ c1을 텍스트로 사용하고 $ c2를 img scr로, $ c1을 img alt로 사용하려면 다음과 같이하십시오. 또는 href scr로 $ c2 어떻게 할 수 있습니까?

답변

2

이 시도 : 또한

<?php foreach ($iteminfos as $iteminfo): ?> 
    <li> 
    <a href="javascript:showDiv(<?php echo(json_encode($iteminfo)) ?>)"> 
     <?php echo($iteminfo['c1']); ?> 
    </a> 
    </li> 
<?php endforeach;?> 

, 당신의 행 데이터 취할 showDiv 수정 : 기본적으로

function showDiv(row) { 
    document.getElementById('infoDiv').style.visibility='visible'; 
    document.getElementById('infoDiv').innerHTML = row['c1']; 
} 

을, 당신이 고려해야하는 브라우저에서 자바 스크립트 실행 오랫동안 PHP 스크립트의 실행 후 끝났다. 따라서 자바 스크립트가 웹 사이트에 필요한 모든 데이터를 임베드하거나 런타임에 가져와야합니다 (이 경우 상황이 느리고 복잡해집니다).

+0

여기에는 큰 따옴표가 있고 큰 따옴표는 문제가 있습니다. – DrXCheng

+0

@xuc : 아, 맞아, \를 \\와 "with \"를 PHP로 대체하면 작동 할 것입니다. – thejh

+0

"with"(\ "대신)를 바꿀 때 작동합니다. – DrXCheng

0

페이지에 여러 항목이있는 정보 영역을 하나만 표시하고 항목을 클릭하면 정보 영역이 새 콘텐츠로 바뀌습니까 ??? 또는 각 항목에 대해 새로운 정보 영역을 원하십니까 ??

나는 첫 번째 접근법의 행을 따라 무엇인가를 보았으므로 나는 후자에 착수 할 것이다.

<?php 
//do some php magic and get your results 
$sql = 'SELECT title, c1, c2 FROM items'; 
$res = mysql_query($sql); 

$html = ''; 
while($row = mysql_fetch_assoc($res)) { 
    $html .= '<li><a class="toggleMe" href="#">' . $row['title'] . '</a><ul>'; 
    $html .= '<li>' . $row['c1'] . '</li><li>' . $row['c2'] . '</li></ul>'; 
    $html .= '</li>'; //i like it when line lengths match up with eachother 
} 
?> 
<html> 
</head> 
<script type="text/javascript"> 
window.onload = function(){ 
    var els = document.getElementsByClassName("toggleMe"); 
    for(var i = 0, l = els.length; i < l; i++) { 
     els[i].onclick = function() { 
      if(this.style.display != 'none') { 
      this.style.display = 'block'; 
      } else { 
      this.style.display = 'none'; 
      } 
     } 
    } 
} 
</script> 
</head> 
<body> 
<ul> 
<?php 
echo $html; 
?> 
</ul> 
</body> 
</html> 
+0

오, ** css **'.toggleMe {display : none;}' – rlemon

관련 문제