Question

我有一个DIV列表，点击它时应该隐藏顶部div以显示下面的文字。

它运行正常，但是如果我尝试使用PHP插入DIV数字ID，它就会失败。

例如，如果我这样做，它会将它应用于正确的DIV

<script>
    $('.reveal2').on({
        click: function(){
            $('.remove2').css({display: 'none'});
        $('.code2').css({display: 'block'});
        }
    });
</script>

但是如果我这样做，它就不起作用了：

<?php $example = '2'; ?>

<script>
    $('.reveal<?php echo $example ?>').on({
        click: function(){
            $('.remove<?php echo $example ?>').css({display: 'none'});
        $('.code<?php echo $example ?>').css({display: 'block'});
        }
    });
</script>

我在这里创建了一个工作代码的jsfiddle：http://jsfiddle.net/RGQaU/

我无法解决为什么插入php变量会使其无效。

任何想法都非常感激。

更新：我在jQuery库上使用defer，关闭后推迟上面的工作。但是我需要推迟jQ，我已经尝试在window.onload中包装上面的代码，但仍然无法工作。

Answer 1

也许您应该尝试清理代码，我会将该值写入js变量，如下所示：

<?php $example = '2'; ?>

<script>
    var example = "<?php echo $example ?>";
    $('.reveal'+example).on({
        click: function(){
            $('.remove'+example).css({display: 'none'});
        $('.code'+example).css({display: 'block'});
        }
    });
</script>

那么，为什么你应该总是这样使用：

这样您就可以将问题集中在一个地方，更容易调试
您始终可以使用控制台调试来检查存储在javascript变量中的值：示例
这些双引号将为您提供回调，以防您回显类似：false，null ...防止js错误，可能会阻止您的整个页面执行javascript。

Answer 2

$('.remove<?php echo $example ?>')

肯定是缺少分号？

或者，试试这个：

<script>
    $(document).ready(function() {
        $('.reveal<?php echo $example; ?>').on({
            click: function() {
                $('.remove<?php echo $example; ?>').css({display: 'none'});
                $('.code<?php echo $example; ?>').css({display: 'block');
            }
        });
    });
</script>

Answer 3

你引用不太正确：

变化：

$('reveal<?php echo $example ?>').on({

要：

$('.reveal'<?php echo $example ?>).on({

在你使用它的每个地方。

JS中的PHP变量不起作用

3 个答案: