Php echo jQuery 点击问题

Question

我的这个页面有一个按钮，在 php 中有回显。我还回显了一个 jQuery 脚本，以便在单击按钮时滑动切换一个 ul 列表元素。这里的问题是jQuery javascript 脚本在回显按钮的同时回显，我想不出有什么办法可以延迟它。

代码：

<?php
include_once('../php/connDb.php');
mysqli_set_charset($connect, 'utf8');
$query = mysqli_query($connect, "SELECT * FROM pages WHERE page_id = '".$page_id."'");
while($row = mysqli_fetch_assoc($query))
{
    echo '<h3>'.$row['text'].'</h3>';
}
$query = mysqli_query($connect, "SELECT * FROM menu");
echo '<div id="menuArea">';
while($row = mysqli_fetch_assoc($query))
{
    $menuName = $row['menuName'];
    $menuElements = $row['menuElements'];
    $menuElements = explode(", ", $menuElements);
    echo '
    <button id="'.$menuName.'"><h3 id="'.$menuName.'h3">'.$menuName.' &#X25BE;</h3></button>
        <ul id="'.$menuName.'S" class="menuCollapseSecond">
    ';
    foreach($menuElements as $menuElement)
    {
        echo '<li>'.$menuElement.'</li>';
    }
    echo '</ul>';
}
echo '</div>';
?>
</div>
<img id="sacImg" src="../images/sac.png">
<p>Copyright © Le Kerouac 2015</p>
</div>
<?php
$query = mysqli_query($connect, "SELECT * FROM menu");
while($row = mysqli_fetch_assoc($query))
{
    echo '
    <script type="text/javascript">
    $(document).ready(function() 
    {
        $("#'.$menuName.'").click(function()
        {
            $("'.$menuName.'S").slideToggle();
        });
    });
    </script>
    ';
}
mysqli_close($connect);
?>

我把document.ready放到脚本里，也把脚本移到了页面底部，但没用

Answer 1

首先，您需要在脚本部分使用 S 向动态创建的 ul id 添加 #，以便通过 Id 捕获 DOM 对象。

其次，使用 jquery 'on' 函数在创建此元素时将事件绑定到该元素，因此您的代码应如下所示：

...
while($row = mysqli_fetch_assoc($query))
{
    echo '
    <script type="text/javascript">
    $(document).ready(function() 
    {
        $("#'.$menuName.'").on( "click", function() {
        {
            $("#'.$menuName.'S").slideToggle(); // adding # to catch element by Id
        });
    });
    </script>
    ';
}
....

Php echo jQuery 点击问题

Php echo jQuery click issue

html

javascript

php

jquery

html-lists