使用jQuery更新文本區域

Question

我正在嘗試使用jquery更新數據，但是如果輸入了textarea，它會失敗，這在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>

我的更新功能是

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

我的文本區域輸入是

<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>

如果在插入文本區域數據時沒有按回車鍵，則此代碼可以正常工作

我得到的錯誤是

Uncaught SyntaxError: Invalid or unexpected token

我的插入功能是

$(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);

任何幫助將不勝感激。

Answer 1

您可以阻止使用事件監聽器在textarea中按Enter的默認操作。

 <textarea placeholder="You can not press enter"></textarea> <script> document.querySelector("textarea").addEventListener("keypress", function(e){ if(e.keyCode==13){ e.preventDefault(); } }); </script> 

在服務器端，使用PHP，應將所有換行符替換為空的String，這樣插入不會失敗（根據此答案）。

str_replace("\r\n", "", "your insertion statement string");  

Answer 2

首先，@ epascarello正確地說您需要對進入數據庫的所有數據進行轉義。 您還以一種非常不安全的方式來進行此操作，這肯定會被黑客入侵。 以這種方式創建SQL語句可以打開稱為SQL Injection的代碼，這可能是網站被黑客入侵的最常見方式。

您需要使用准備好的語句並保護您的代碼以保存數據，並對輸入的數據進行編碼。

根據本指南中的示例以及此處給出的說明，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 );
}