使用 mysqli 从 contentEditable div 保存数据

Question

我正在尝试将数据从 contentEditable div 保存到 mySql 数据库。但似乎'+'符号不能存储在数据库中。这是正确的概念还是我遗漏了什么？

index.php

<div id="la_sent" contentEditable=true></div>
<button class="saveChanges">Save changes</button>

script.js

$(document).ready(function(){
  $( ".saveChanges" ).click(function() {
      content = $('#la_sent').html();
      dataUrl = "iid=1&content="+content;
      $.ajax({
        url:"ajax.php",
        type:"POST",
        data:dataUrl,
        success:function(data){
            ...
      }});
  }); 
});

ajax.php

$type = $_POST['iid'];
$content = $_POST['content'];
$mysqli=connect_database(); //connection to database
$stmt = $mysqli->prepare('UPDATE email_structure SET content = ? WHERE type = ?');
$stmt->bind_param('ss', $content, $type);
$ress = $stmt->execute();
$stmt->close();
$mysqli->close();
echo "OK";

例如：如果我在 div 元素字符串 'a+b+c' 中写入，它会在数据库字符串 'a b c ' 中添加。知道为什么吗？

Answer 1

为了安全起见，在将文本插入数据库之前（使用搜索、存储等），您应该始终对文本进行转义。请参阅 php 的 mysqli_real_escape_string 来执行此操作。即使您使用的是准备好的语句，您仍然应该对字符进行转义。

如果确实有问题，您可以将 + 替换为另一个字符，然后在从数据库中检索时将其替换回去

Answer 2

默认情况下，加号会被替换为空格，因此您必须先对它们进行编码。

encodeUriComponent 是 javascript

中的一种方法

因此编辑您的 script.js 以通过 encodeURIComponent 传递 content 变量，然后再将其附加到 datUrl 应该可以解决问题。

$(document).ready(function(){
  $( ".saveChanges" ).click(function() {
      content = $('#la_sent').html();
      dataUrl = "iid=1&content="+encodeURIComponent(content);  //encode content variable
      $.ajax({
        url:"ajax.php",
        type:"POST",
        data:dataUrl,
        success:function(data){
            ...
      }});
  }); 
});

使用 mysqli 从 contentEditable div 保存数据

Save data from contentEditable div with mysqli

php

mysql

jquery

mysqli

contenteditable