jQuery 将 div 更改为 HTML5 contenteditable 并传递给 php

【问题标题】：jQuery change div to HTML5 contenteditable and pass to phpjQuery 将 div 更改为 HTML5 contenteditable 并传递给 php
【发布时间】：2013-01-16 20:21:17
【问题描述】：

当前我有以下 div

 <div class="tag-header">
    <?php echo $row->name; ?>
 </div>

然后我用 .attr 将 contenteditable 添加到 div

$('.tag-header').attr("contenteditable", "true");

但我的问题是如何将值传递给 php 并发布到数据库？ *注意：我还没准备好使用 ajax 只是普通的 php 提交。

【问题讨论】：

您可能必须在表单中放置一个名为 ContentEditable 的隐藏输入，然后在添加属性时将其设置为 true，然后在发布表单时，您将能够检索该值ContentEditable 输入的
改用<form> 和<input> 字段。

标签： php jquery html contenteditable

【解决方案1】：

添加了demo here

将 html 更新为

<form>
<div class="tag-header">
    <?php echo $row->name; ?>
 </div>
<input type="hidden" id="tagval" />
</form>

然后使用focusout事件绑定

$(".tag-header").focusout(function() {
   $("#tagval").val($(".tag-header").text());
});

提交表单以获取 PHP 中的值。

【讨论】：

还有 1 个问题。 contenteditable 之前已经包含文本，如果用户没有输入，如何获取之前的文本？
$("#tagval").val($(".tag-header").text()); 在$('.tag-header').attr("contenteditable", "true");上方添加这一行
不起作用。你能看看这个jsfiddle.net/pHKdC/1里面的解释吗
它只能在没有 .focusout 的情况下工作，但如果没有 .focusout，当我在 contenteditable div 中输入时它不会同步
ic，我刚刚明白你的意思“添加”，我正在移动线路。再次感谢。