我如何在 PHP 中使用 Jquery

Question

I need to create a database for school.我需要为学校创建一个数据库。 When I hover a object in my column 'Champion', I want to show the user a picture of the champion on the left side.当我将一个对象悬停在“冠军”列中时，我想在左侧向用户显示冠军的照片。 I want to do this with Jquery.我想用 Jquery 做到这一点。 I have searched over the web, but i can't find the answer.我在网上搜索过，但我找不到答案。 here is my script:这是我的脚本：

<html>
    <head>
        <link rel="stylesheet" type="text/css" href="stijl.css">
    </head>
    <body>    
        <?php       
            echo '<aside id="links"><p id="Aatrox"><img src="http://eindwerkstef.be/php/champions/Aatrox.jpg"/><p></aside>';
            echo '<form action="php54.php" method="post">'; 
            echo '<aside>';
            echo '<select name="sorteren"><option value="Champion">Champion</option><option value="Role">Role</option><option value="Lane">Lane</option><option value="Counter">Counter</option></select>';
            echo '<select name="sorteren2"><option value="Champion">Champion</option><option value="Role">Role</option><option value="Lane">Lane</option><option value="Counter">Counter</option></select>';
            echo '</br><input type="submit" name="submit" value="Sorteer!"/>';
            echo '</br><p>Wat wilt u Weergeven?</p>';
            echo '<select name="toonL"><option value="Top">Top</option><option value="Mid">Mid</option><option value="Jungle">Jungle</option><option value="Bottom">Bottom</option></select>';
            echo '<input type="submit" name="toon1" value="Toon"/>';
            echo '</aside>';

            mysql_connect('xxx','xxx','xxx');
            mysql_select_db('xxx');

            if (isset($_POST['submit'])){
                $query= "SELECT * FROM lolOverzicht ORDER BY {$_POST['sorteren']}, {$_POST['sorteren2']}";
                $res=mysql_query($query);
                echo "<table border='1' id='tbloverzicht'><tr><td><b>Champion</td><td><b>Role</td><td><b>Lane</td><td><b>Counter</td></tr>";

                while ($row=mysql_fetch_array($res)){
                    echo "<tr><td><p>".$row['Champion']."</p></td><td>".$row['Role']."</td><td>".$row['Lane']."</td><td>".$row['Counter']."</td><td><a href=\"lolwijzig.php?id={$row['Nummer']}\">Wijzig</a></td><td><a href=\"lolverwijder.php?id={$row['Nummer']}\">Verwijder</a></td></tr>";
                }
                echo "</table>";
            }

            if (isset($_POST['toon1'])){
                $query= "SELECT * FROM lolOverzicht WHERE Lane = '{$_POST['toonL']}' ORDER BY {$_POST['sorteren']}, {$_POST['sorteren2']}";
                $res=mysql_query($query);
                echo "<table border='1' id='tbloverzicht'><tr><td><b>Champion</td><td><b>Role</td><td><b>Lane</td><td><b>Counter</td></tr>";

                while ($row=mysql_fetch_array($res)){
                    echo "<tr><td>".$row['Champion']."</td><td>".$row['Role']."</td><td>".$row['Lane']."</td><td>".$row['Counter']."</td><td><a href=\"lolwijzig.php?id={$row['Champion']}\">Wijzig</a></td><td><a href=\"lolverwijder.php?id={$row['Champion']}\">Verwijder</a></td></tr>";
                }
                echo "</table>";
            }
            echo "</table>";        
            mysql_close();
        ?>

        <script src="script/jquery-1.11.1.min.js" type="text/javascript">
            $(document).ready(function(){
                $('img').on('mouseover', function(){
                    $(this).fadeTo('fast', 1.0);
                });
                $('img').on('mouseout', function(){
                    $(this).fadeto('slow', 0.4);
                });
            });
        </script>    
    </body>
</html>

Answer 1

First of all, I see that you are a little bit confused.首先，我看到你有点困惑。

PHP is a server-side programming language; PHP是一种server-side编程语言； this means that all the PHP code is rendered on the server before sending the page to the client (browser).这意味着在将页面发送到客户端（浏览器）之前，所有 PHP 代码都在服务器上呈现。

JQuery is a JavaScript class that aims to simplify JavaScript scripting/programming; JQuery是一个JavaScript类，旨在简化JavaScript脚本/编程； JavaScript is a client-side scripting/programming language, this means that any JavaScript/JQuery code is executed on the client (by the browser we can say). JavaScript是一种client-side脚本/编程语言，这意味着任何JavaScript/JQuery代码都在客户端（我们可以说是浏览器）上执行。

Alright, now about your question.好的，现在关于你的问题。 If you want to show an image on mouseover event of a group of cells/column, you can do something like this:如果要在一组单元格/列的鼠标悬停事件上显示图像，可以执行以下操作：

<html>
<head>
    <link rel="stylesheet" type="text/css" href="stijl.css">
</head>
<body>    
        <!-- the following code does not need PHP, so just leave it as HTML -->
        <aside id="links">
            <p id="Aatrox">
                <img src="http://eindwerkstef.be/php/champions/Aatrox.jpg"/>
            <p>
        </aside>
            <form action="php54.php" method="post">
                <aside>
                    <select name="sorteren">
                        <option value="Champion">Champion</option>
                        <option value="Role">Role</option>
                        <option value="Lane">Lane</option>
                        <option value="Counter">Counter</option>
                    </select>
                    <select name="sorteren2">
                        <option value="Champion">Champion</option>
                        <option value="Role">Role</option>
                        <option value="Lane">Lane</option>
                        <option value="Counter">Counter</option>
                    </select>
                    </br>
                    <input type="submit" name="submit" value="Sorteer!"/>
                    </br>
                    <p>Wat wilt u Weergeven?</p>
                    <select name="toonL">
                        <option value="Top">Top</option>
                        <option value="Mid">Mid</option>
                        <option value="Jungle">Jungle</option>
                        <option value="Bottom">Bottom</option>
                    </select>
                    <input type="submit" name="toon1" value="Toon"/>
                </aside>
    <?php
        $address = "localhost"; // this is your database's address
        $username = "root"; // this is your mysql username
        $password = "1234"; // this is your mysql password
        $database = "example"; // this is your database
        $connection = mysqli_connect($address, $username, $password, $database);

        if (isset($_POST['submit'])){
            $query = "SELECT * FROM lolOverzicht ORDER BY {$_POST['sorteren']}, {$_POST['sorteren2']}";
            $res = mysqli_query($connection, $query);
            echo("<table border='1' id='tbloverzicht'><tr><td><b>Champion</td><td><b>Role</td><td><b>Lane</td><td><b>Counter</td></tr>");

            while ($row = $res->fetch_assoc()){
                echo("<tr>");
                echo("<td class='col-champion'>".$row['Champion']."</td>
                      <td>".$row['Role']."</td>
                      <td>".$row['Lane']."</td>
                      <td>".$row['Counter']."</td>
                      <td><a href=\"lolwijzig.php?id={$row['Nummer']}\">Wijzig</a></td>
                      <td><a href=\"lolverwijder.php?id={$row['Nummer']}\">Verwijder</a>
                      </td>");
                echo("</tr>");
            }
            echo "</table>";
        }

        if (isset($_POST['toon1'])){
            $query = "SELECT * FROM lolOverzicht WHERE Lane = '{$_POST['toonL']}' ORDER BY {$_POST['sorteren']}, {$_POST['sorteren2']}";
            $res = mysqli_query($connection, $query);
            echo "<table border='1' id='tbloverzicht'><tr><td><b>Champion</td><td><b>Role</td><td><b>Lane</td><td><b>Counter</td></tr>";

            while ($row=mysql_fetch_array($res)){
                echo("<tr>");
                echo("<td class='col-champion'>".$row['Champion']."</td>
                      <td>".$row['Role']."</td>
                      <td>".$row['Lane']."</td>
                      <td>".$row['Counter']."</td>
                      <td><a href=\"lolwijzig.php?id={$row['Champion']}\">Wijzig</a></td>
                      <td><a href=\"lolverwijder.php?id={$row['Champion']}\">Verwijder</a></td>");
                echo("</tr>");
            }
            echo("</table>");
        }        
        mysqli_close($connection);
    ?>

    <img src"" id="img">

    <script src="script/jquery-1.11.1.min.js" type="text/javascript"></script>
    <script>
        $(document).ready(function(){
            $('#img').hide();
        });

        $('.col-champion').mouseover( function(e){
            /* 
            Since I don't know where and how you decide which image to show, that's up to you 
            then to change img source just use:
            $("#img").attr("src","chosenimage.jpg");
            */
            $('#img').show();
            $("#img").offset({left:e.pageX,top:e.pageY});
        });

        $('.col-champion').mouseout( function(e){
            $('#img').hide();
        });

    </script>    
</body>

NOTE: I changed from mysql to mysqli because mysql is deprecated now, I highly recommend you to use mysqli for your next projects.注意：我从 mysql 更改为 mysqli，因为现在不推荐使用 mysql，我强烈建议您在下一个项目中使用 mysqli。

ADVICE: For future questions I highly recommend you to explain every single detail of your problem, providing everything you think would make your question easier to understand.建议：对于以后的问题，我强烈建议您解释问题的每一个细节，提供您认为会使您的问题更容易理解的所有内容。

Then if you need some fade effects you can give a look at JQuery's official documentation by clicking here然后，如果您需要一些淡入淡出效果，您可以通过单击此处查看 JQuery 的官方文档

I hope this helped you and good luck with your homework!.我希望这对你有所帮助，并祝你的家庭作业好运！

我如何在 PHP 中使用 Jquery

问题描述

1 个解决方案

解决方案1
0

我如何在 PHP 中使用 Jquery

问题描述

1 个解决方案

解决方案1 0

解决方案1
0