如何在 php 页面中插入 jqueryUi（显示效果 -> 拖放）

Posted 2023-05-09

【中文标题】如何在 php 页面中插入 jqueryUi（显示效果 -> 拖放）

【英文标题】：How to insert jqueryUi (Show Effect -> Drop) in a php page

【发布时间】：2017-05-02 06:42:32

【问题描述】：

我正在尝试使用一种效果从我的数据库写入我的页面。目的是，当它在页面上写我的评论时，以效果显示它。

<?php
    if(count($_POST) > 0)
        echo '<script language="javascript">';
        echo '$( "#toggle" ).toggle( "drop" );';
        echo '</script>';

        $db = new mysqli("localhost", "root", "usbw", "trab_projeto");

        $qr = $db->query("INSERT INTO comments(comment) VALUES ('$_POST['mensagem']')");

        echo "<fieldset id='toogle'>";
        echo "<p>";
        $row = $db->query("SELECT * FROM comments ORDER BY comment_id DESC LIMIT 1")->fetch_assoc();
        echo $row["comment"];
        echo "</p>";
        echo "</fieldset>";
    
?>

脚本的一部分不起作用。 这些代码在我点击提交表单时执行。

<div class="cadastro">
    <form action="" id="form-msg" method="post" enctype="multipart/form-data">
        <fieldset>
            <p>
                <span><b>Escreva aqui o seu comentário:</b></span><br>
                <textarea name="mensagem" style="margin: 0px; width: 511px; height: 119px;"></textarea>
            </p>
            <input type="submit" value="Enviar">
        </fieldset>
    </form>     
</div>

【问题讨论】：

您遇到了有关 SQL 注入攻击的安全问题。 Take a look at how to fix this.

谢谢！但这并不是我想要的。我可以在数据库上插入，但我希望评论出现效果。jqueryui.com/show

使用 Drop 选项

【参考方案1】：

要返回 JSON 响应，您必须首先将其放入您的 header()。在脚本的顶部附加：

header('Content-type: javascript/json');

继续前进，为了防止您的 SQL 注入，我已将驱动程序更改为 PDO，您可以在其中找到文档。

header('Content-type: javascript/json');
$driver = new PDO('mysql:host=localhost;dbname=trab_projeto', 'root', 'password');
$state = false;
if(
    !isset($_POST['mensagem']) &&
    !empty($_POST['mensagem'])
) 
    $driver->Prepare('INSERT INTO comments (comment) VALUES (?)');
    $state = $driver->execute(array($_POST['mensagem']));

if($state)

    echo json_encode(array('status' => true));
    exit;

echo json_encode(array('status' => false));
exit;

为了将来的通知，此“评论”未附加到任何“线程”范围。如果您有多个个帖子，您应该为每个帖子指定一个唯一的 ID，并将帖子 ID 与评论交叉引用，以便您可以加载该特定帖子的 cmets。

然后您可以使用 jQuery 发送请求，如下所示：

$(document).ready(function() 
    var form = $('#form-msg');
    comment = form.closest('textarea').val();
    $.post('the_file_path.php',  mensagem: comment )
        .done(function(response) 
            if(response.status) 
                // todo: success using the effect below
            
        );
);

请注意，上面的以下代码需要将click() 附加到您的提交按钮。考虑删除这行代码：

<input type="submit" value="Enviar">

并使用：

<button type='button'>Enviar</button>

所以你可以像这样通过表单来定位它：

form.closest('button').click(function() 
    // ...

您可以在向用户端显示评论时使用效果，如下所示：

var commentToAdd = document.createElement('p');
commentToAdd.innerhtml = comment;
$('#comments').append(commentToAdd);
commentToAdd.show('slow');