Question

<?php
   echo("var answersC = answer-table-$qrow->id;");
   echo("var toggleC = toggle-table-$qrow->id;");
?>

   jQuery('toggleC').click(function() {
      jQuery('answersC').slideToggle('fast');
});

我没有一个静态的css类名，而是有一个在循环中创建唯一类的页面。我希望能够切换这些单独的区域，但我不知道如何使用变量字符串作为css类的名称。

我也是这样尝试过的，没有更好的运气。

<?php
   echo("var answersC = $qrow->id;");
   echo("var toggleC = $qrow->id;");
?>

   jQuery('.answer-table-'+answerC).click(function() {
      jQuery('answersC'+toggleC).slideToggle('fast');
});

有人有什么想法吗？我不太了解这项工作。谢谢！

更新：我应该补充一点，这是在脚本标记内的PHP页面上。

更新2：

我一直在尝试各种建议，以至于我的眼球感觉他们正抱着一个装满炒鸡蛋的头。我非常擅长google js解决方案，但我对它的知识不是很广泛，因此很难理解当它们不起作用时如何扩展它们。

我现在的位置是这段代码:(注意我从类切换到ID）

<script type="text/javascript" language="javascript">
    <!--
    <?php
    echo("var answersC = 'answertable'+$qrow->id;");
    echo("var toggleC = 'toggletable'+$qrow->id;");
    ?>
    jQuery('#'+toggleC).click(function() {
    jQuery('#'+answersC).slideToggle('fast');
    });
    console.log('#'+toggleC); //example #toggletable6
    console.log('#'+answersC); //example #answertable6
    // -->
    </script>

我可以在firebug中看到变量内容与html中的id匹配，我得到没有错误，但它仍然没有做任何事情。

在其他地方，我使用以下功能显示所有问题的所有答案：

$('.atoggle').click(function() {
$('.answer-table').slideToggle('fast');
});

这个完美无缺，只有我真的只想在每个问题的基础上打开答案。

注意：'$'与'jQuery'的区别只是因为一个在包装函数中的.js文件中允许WordPress中的'$'，那个不工作的文件只是在页面源中这点。非常感谢大家的投入！

更新（最终）：

对于在搜索中遇到此问题的任何人，我都会发布最终的工作代码。还有一个问题需要将其包装在document.ready函数中。

工作版本：

<script type="text/javascript" language="javascript">
    jQuery(document).ready(function() {
    <!--
        <?php
        echo("var answersC = 'answertable'+$qrow->id;");
        echo("var newanswersC = 'newanswertable'+$qrow->id;");
        echo("var toggleC = 'toggletable'+$qrow->id;");
        ?>

        jQuery('.'+toggleC).click(function() {
        jQuery('.'+answersC).slideToggle('fast');
        jQuery('.'+newanswersC).slideToggle('fast');
        });
    });
        // -->
</script>

Answer 1

而不是

jQuery('toggleC').click(function() {
      jQuery('answersC').slideToggle('fast');

尝试

jQuery('.'+toggleC).click(function() {
      jQuery('.'+answersC).slideToggle('fast');

请注意，如果您的网页上有多个切换和答案，请点击切换，点击所有答案。要仅切换属于点击答案的答案：

jQuery('.'+toggleC).click(function() {
      jQuery(this).find('.'+answersC).slideToggle('fast');

最后，请注意，您不需要在类中添加id（transversability，yada yada），并且您可以使用类似

的内容

jQuery('table').delegate('.'+toggleC, 'click', (function() {
    jQuery(this).find('.'+answersC).slideToggle('fast');

为了只创建一个事件处理程序而不是“行数”。（但这不是很重要）

Answer 2

如果answer-table-*ID*和answersC*ID*是归因于某些HTML元素的类，请尝试以下操作：

<?php
echo 'var qrow_id = '.$qrow->id.';';
?>

jQuery('.answer-table-'+qrow_id).click(function() {
      jQuery('.answersC'+qrow_id).slideToggle('fast');
});

如何使用变量内容作为css类名？

2 个答案: