Javascript 使用jquery更新文本区域

Javascript 使用jquery更新文本区域,javascript,php,jquery,Javascript,Php,Jquery,我正在尝试使用jquery更新数据,但如果textarea中有enter,它将失败,这在mysql中由\r\n表示 我的更新函数代码是 <td><i class="fa fa-edit" onclick="upd('<?php echo $fetch_news ['title']; ?>', '<?php echo $fetch_news ['d

我正在尝试使用jquery更新数据,但如果textarea中有enter,它将失败,这在mysql中由\r\n表示

我的更新函数代码是

<td><i class="fa fa-edit" onclick="upd('<?php echo $fetch_news ['title']; ?>',
                                                          '<?php echo $fetch_news ['detail']; ?>',
                                                          '<?php echo $fetch_news ['date']; ?>',
                                                          '<?php echo $fetch_news ['id']; ?>'
                                                          )"></i></td>
我的文本区域输入是

<div class="form-group"><textarea id="newsDetails" name="newsDetails" title="News Location (less than 200 words)" placeholder="News Details (less than 200 words)" required="" class="form-control"></textarea></div>
我的插入函数是

function upd(title,detail,date,id)
{
  $("#newsTitle").val(title);
  $("#newsDetails").val(detail);
  $("#newsDate").val(date);
  $("#id").val(id);
}
$(function () {
      $("#form").on("submit", function(){
            $.ajax({
                url: "extra/logical.php?pg=news&tsk=ins",
                type: 'POST',
                data: new FormData(this),
                contentType: false,
                cache: false,
                processData: false,
                success: function(data) {
                  $("#showdata").html(data);
                  $("#newsTitle").val('');
                  $("#newsDetails").val('');
                  $("#newsDate").val('');
                  $("#id").val('');
                }
            });
            return false;
        });
    });
插入查询是

$ins="insert into news set title='".$_POST['newsTitle']."',
                                        detail='".$_POST['newsDetails']."',
                                        date='".$_POST['newsDate']."'
                                        ";
        mysqli_query($conn,$ins);

任何帮助都将不胜感激。

您可以使用事件侦听器阻止在
文本区域中按enter键的默认操作


document.querySelector(“textarea”).addEventListener(“按键”,功能(e){
如果(e.keyCode==13){
e、 预防默认值();
}
});

首先,@epascarello正确地指出您需要转义进入数据库的所有数据。你也在以一种极不安全的方式做这件事,保证会被黑客攻击。通过这种方式创建SQL语句可以打开代码,实现所谓的SQL注入,这可能是网站被黑客攻击的最常见方式

您需要使用准备好的语句,保护代码,保存数据,并对输入的数据进行编码

根据中的示例和其中给出的解释,PDO是处理保存到数据库中的用户输入的唯一安全方法。这是因为在将数据放入查询之前,准备好的语句是在数据库服务器上准备的

至于代码,请查看以下内容以保存数据:

$host = 'localhost';
$db   = 'myDatabase';
$username = 'awesomeUser';
$pass = 'someTotallySecretPassword';
$charset = 'utf8';

$dsn = "mysql:host=$host;dbname=$db;charset=$charset";

$opt = [ PDO::ATTR_DEFAULT_FETCH_MODE => PDO::FETCH_ASSOC];

$pdo = new PDO($dsn, $username, $password, $opt);
$stmt = $pdo->prepare('INSERT INTO news SET title = :title, details = :details, date = :date');
$stmt->execute([
    'title' => urlencode($_POST["newsTitle"]), 
    'details' => urlencode($_POST["newsDetails"]),
    'date' => $_POST["newsDate"]
]);
$user = $stmt->fetch();
我将建议您自己在服务器上用SQL或PHP创建日期,除非您的用例需要用户能够插入与您正在创建的新闻文章的创建时间不同的日期。如果用户确实需要插入任意日期,您还需要对其进行一些验证,以确保其有效

现在,当您需要再次取出数据时,需要使用javascript对数据库中的数据进行解码:

function decode(text)
{
    return decodeURIComponent(text.replace(/\+/g,' '));
}

function upd(title,detail,date,id)
{
  $("#newsTitle").val( decode(title) );
  $("#newsDetails").val( decode(detail) );
  $("#newsDate").val( date );
  $("#id").val( id );
}

在保存到数据库之前,请使用htmlspecialchars,另外,您是否可以显示保存到MySQL的代码?问题是,HTML标记中添加了enter,因此它正在向事件侦听器中添加enter。。。。您需要转义它。@MyLibary请参阅保存到MySQL的代码。我updated@epascarello如何逃避这个谢谢你提供了这么有用的信息。我会努力的。另外,请告诉我,如果在插入时使用mysqli_real_escape_string()而不是PDO,该怎么办。@AnilSangwa好吧,它会更好,但仍有一些漏洞。准备好的语句由服务器进行预处理,这确保了查询本身不能仅仅通过插入文本来更改。修改查询是sql注入的核心。我的数据库连接是$conn=mysqli_connect('localhost','root','password','lucentsapi')或die('failed to connect');我需要什么来改变这个?如果是,为什么?@AnilSangwa如果你看我给你的代码示例,你可以看到组成连接字符串信息的变量<代码>$host='localhost'$用户名='root'$密码='密码'$db=‘lucentsapi’将实现并让您知道
function decode(text)
{
    return decodeURIComponent(text.replace(/\+/g,' '));
}

function upd(title,detail,date,id)
{
  $("#newsTitle").val( decode(title) );
  $("#newsDetails").val( decode(detail) );
  $("#newsDate").val( date );
  $("#id").val( id );
}