php while循环内的javascript [英] javascript inside php while loop

问题描述

我有这个代码:

<?php
$i=5;
while($i > 0){
echo '
<table width="500px" border="1">
  <tr>
    <td>
    <button id="button">Show comments</button>
    </td>
  </tr>
  <tr>
    <td id="comments" style="display:none;height:300px;width:100%;"></td>
  </tr>
</table>

<script type="text/javascript">
$("#button").toggle(
    function (){
        $("#button").text("Hide Comments");
        document.getElementById("comments").style.display="inline";
    },function (){
        $("#button").text("Show Comments");
        document.getElementById("comments").style.display="none";
    }
);
</script>
<script type="text/javascript" src="jquery.js"></script>
';

$i--;

}
?>

单击显示评论"按钮时，将显示评论框.它适用于第一个.但这对其他人不起作用.怎么了?

When the show comments button is clicked the comment box should show up. It works for the first one. But it doesn't work for the others.What's wrong?

推荐答案

我只是逃脱了php解释器并将HTML标记直接打印到页面中.我还将id更改为class，因此我们可以更轻松地重用它们，而无需添加古怪的数字.

I'd just escape the php interpreter and print the HTML markup directly into the page. I'd also change the ids to classes, so we can more easily reuse them without quirky additional numbers.

<?php
$i=5;
while($i > 0):
?>
    <table width="500px" border="1">
       <tr>
          <td><button class="button" data-clicked="0">Show comments</button></td>
       </tr>
       <tr>
          <td class="comments" style="display:none;height:300px;width:100%;"></td>
       </tr>
    </table>
<?php
$i--;
endwhile;
?>

我不知道节目的the element with an ID是什么，但是我们只是假设它是按钮.

I don't know what the element with an ID of show is, but we'll just assume it was the button.

$(".button").click(function (){
    var $this = $(this);
    if(!$this.data('clicked')){
        $this.text("Hide Comments");
        $this.closest('table').find('.comments').css('display', 'inline');

        $this.data('clicked', 1);
    }else{
        $this.text("Show Comments");
        $this.closest('table').find('.comments').css('display', 'none');

        $this.data('clicked', 0);
    }

});

不要在php的while循环中打印该javascript，只需将其包含在页面顶部或单独的文件中即可.

Don't print that javascript in a while loop in php, just include it in the head of the page, or in a separate file.

修改

如下面的注释所示，在jQuery 1.9中，toggle不再起作用，因为您打算使用它，作为一种变通方法，您可以在按钮上添加data attribute，并在每次检查时进行检查我们点击.

As indicated in a comment below,in jQuery 1.9 the toggle no longer works as you're intending to use it, as a work around, you can add a data attribute to the button, and check it each time we click.

<button class="button" data-clicked="0">

如您所见，我们已经添加了新的data-clicked属性.

As you can see we've added the new data-clicked attribute.

在上面的JavaScript中，您可以看到我们已经完全改变了它的工作方式.我们执行自己的if/else来检查data-clicked状态.

In our JavaScript above, you can see that we've completely changed how it works. We perform our own if/else to check the data-clicked state.

这篇关于php while循环内的javascript的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！