PHP 루프가 포함 된 'ul'이 있습니다. 이제 자바 스크립트에서 루프에 콘텐츠를 동적으로 추가해야합니다. jQuery .each()각 'li'에 콘텐츠를 성공적 으로 추가했습니다. 그러나 결과에 문제가 있습니다.
내 코드는 다음과 같습니다.
<ul id="ulID">
<?php
if(isset($nav_data['all_notifications'])) {
for($i = 0; $i < $nav_data['number_of_notes'] && $i < 4; $i++){
?>
<li>
<p id="content">
<?php echo $nav_data['all_notifications'][$i]['other_fullname'];?>
//I need to add the content here
</p>
</li>
<script>
var notiTime = moment("<?php echo $nav_data['all_notifications'][$i]['time_sent']?>").format("YYYY-MM-DD hh:mm:ss");
$('#ulID li p').each(function(i) {
(this).append(notiTime);
});
</script>
</ul>
출력에서 첫 번째 li에는 4 개의 내용이 모두 포함됩니다. 두 번째 목록에는 3 개의 내용이 있습니다. 세 번째 목록에는 2 개의 내용이 포함되고 마지막 목록에는 마지막 내용이 포함됩니다.
스크립트가 루프 목록에 콘텐츠를 추가하는 방법에 오류가 있다고 생각합니다. 하지만 어떻게 바꾸어야할지 모르겠습니다.
당신의 도움에 미리 감사드립니다!
좋아, 코드를 분해 해보자.
for4 개의 <li>태그 를 생성 하는 루프가 있습니다 .
for($i = 0; $i < $nav_data['number_of_notes'] && $i < 4; $i++){
이제 <script>내부 for루프가 있습니다. 이 안에 <script>또 다른 루프가 .each()있습니다.
따라서 첫 번째 php루프 에있을 때 1 개만 <li>있고 JavaScript 루프는 1 개를 찾아 변수를 <li>추가 notiTime합니다.
두 번째 php루프에서 2 <li>s가 있고 <script>다시 실행되고 이번에는 JavaScript가이를 찾아서 새 notiTime변수를 추가 합니다 (이제 첫 번째 <li>, 우리는 두 개의 notiTime변수 내용을 갖게됩니다 ).
그리고 이것은 세 번째와 네 번째 php루프에도 적용됩니다.
해결책:
자바 스크립트 코드에서 <li>태그 를 반복하는 대신 마지막 자식 만 찾을 때마다 ( 선택기를 사용하여 ) <ul>가장 최근에 <li>생성 된 자식 만 찾아 변수를 :last-child추가 notiTime합니다.
따라서 부분을 제외하고 코드의 어떤 부분도 건드리지 않을 <script>것입니다.
<script>
var notiTime = moment("<?php echo $nav_data['all_notifications'][$i]['time_sent']?>").format("YYYY-MM-DD hh:mm:ss");
$( "#ulID li:last-child p" ).append(notiTime);
</script>
이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.
침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제
몇 마디 만하겠습니다