2011-08-01 4 views
1

Jquery Show/Hide를 구현하려고하므로 다른 페이지에 링크하지 않고 확장하는 추가 섹션을 읽고 싶습니다.PHP에서 foreach 루프로 Jquery Hide/Show를 사용하는 방법

데이터는 PHP의 foreach 루프에서 오는 확장하고

오전 데 문제가있다 나는 내용이 충분히 긴 경우 HTML 마크 업을 추가하는 기능을 만든 그 난을 클릭하면 더 많은 링크를 읽으면, 그것들 모두를 확장하고 브라우저가 필요한 페이지의 맨 위로 스크롤합니다.

클릭 한 링크에만이 작업을 수행하려면 어떻게해야합니까? PHP에서 varibles를 Jquery에 추가하는 방법이 있습니까?

는 HTML 머리에 JQuery와 스크립트

<script src="js/jquery.js" type="text/javascript"></script> 
<script type="text/javascript"> 
$(document).ready(function(){ 

$('name#read').hide(); 
$('a#read_more').click(function(){ 
$('name#read').slideDown('slow');    
}); 
$('a#read_less').click(function(){ 
$('name#read').slideUp('slow'); 
}); 
}); 
</script> 

PHP 함수

function read_more($content){ 

if (strlen($content) < 150){ 
    return $content; 
} else { 
    $content = substr($content,0,150) . "......<a href='#' id='read_more'>read more</a>" . "<a name id='read'>" . substr($content,150) . "</a>"; 
    return $content; 
} 

} 

답변

1

당신이 찾고있는 것은 이것이다 : 당신의 클릭 핸들러 내에서 http://api.jquery.com/event.stopPropagation/ 사용 event.stopPropagation() 있도록 같은 페이지에 머무를거야.

고유 한 ID를 생성하지 않았기 때문에 다중 쇼가 발생했습니다. html 태그에 data- * 속성을 지정하거나 'a'태그에 고유 한 ID를 추가하십시오.

$('a.readMore').click(function() { 
    event.stopPropagation(); 
    var data_id = $(this).data('contentId'); 
    $('#'+data_id).show(); //or fadeIn or slideUp/Down... 
} 

귀하의 HTML 다음이 같은 것 : : 이런 식으로 뭔가 작업을해야합니다

<a href="#" class="readMore" data-contentId="1">...read more</a> 
<div id="1">My Content to show goes here</div> 

는 사업부가 될 필요는 없지만, 당신은 내가 얻을 ...

+0

아악 덕분에 아이디어를 얻을 그것! 데이터베이스에 자동 증가분을 HTML에 할당하고 HTML 속성 값으로 가져올 수 있습니다. – user866190

관련 문제