如何在JQuery中保存html时删除'contenteditable‘属性
在jQuery中保存HTML并删除'contenteditable'属性，可以通过以下步骤实现：
- 首先，使用jQuery选择器选中需要保存的HTML元素。例如，如果要保存一个具有'id'为'myElement'的元素，可以使用以下代码：
var htmlContent = $('#myElement').html();- 接下来，使用jQuery的
.removeAttr()方法删除'contenteditable'属性。这将使元素变为不可编辑状态。例如，如果要删除'contenteditable'属性，可以使用以下代码：
$('#myElement').removeAttr('contenteditable');- 最后，将保存的HTML内容和已删除'contenteditable'属性的元素重新插入到页面中。例如，如果要将保存的HTML内容重新插入到具有'id'为'myContainer'的容器中，可以使用以下代码：
$('#myContainer').html(htmlContent);这样，你就可以在jQuery中保存HTML并删除'contenteditable'属性了。
关于jQuery的更多信息和用法，你可以参考腾讯云的jQuery产品介绍页面：jQuery产品介绍。
相关·内容
4回答
html
<div contentEditable="true">testing....</div>
jQuery
$(document).ready(function(){
$('[contenteditable]').removeAttr('contenteditable');
});
上面的代码很好，而且工作正常。你可以感觉到它。
现在，试试这个
$('[contentEditable]').removeAttr('contentEditable');
// notice th
浏览 6提问于2010-07-07得票数 7
回答已采纳
我正在使用“数据库优先”的方法构建我的第一个MVC应用程序，一切工作正常，然而，我被困在使用jQuery使MVC表可编辑(内联)这一点上，当我点击该链接时，每行都有一个链接，场景应该如下所示：
单击特定行中的链接
2-使此特定行可编辑
问题如下：
1-当我点击特定行的链接时
2-所有行都变为可编辑！
以下是HTML代码：
<table id="my_table">
<tr>
<th>
@Html.DisplayNameFor(model =>
浏览 0提问于2016-07-13得票数 2
回答已采纳
2回答
对于一种博客帖子编辑器，给出了以下html：
<div class="entry">
<div class="title" contenteditable="true">
<h2>Title goes here</h2>
</div>
<div class="content" contenteditable="true">
<p>content goes here</p>
</d
浏览 4提问于2013-11-07得票数 3
回答已采纳
1回答
我正在开发一个所见即所得，DnD (拖放)，文本编辑器在html5和javascript。
我正在使用新的库。我有一个似乎没有解决的问题。我想让DnD和内容都可以编辑一些元素。排序插件工作，所需的元素是可排序的，但可排序的类元素的行为不能编辑内容。
我遗漏了什么？
<html>
<head>
<script src="jquery-1.10.2.js"></script>
<script src="jquery.sortable.js"></script>
<
浏览 1提问于2015-01-06得票数 0
我正在尝试构建一个“工具”(带有菜单的beina主页，以及带有一些表格的几个子页面)，用于为我和我的作品拼贴从预先编写的比特中组合答案。我只想做我自己的html编辑，但我想为他们做一些改进…我不知道该怎么做，尽管我试过了。
我在stack/jsfiddle上找到了一个很好的、可编辑的表，可以让它运行，但是保存不起作用。它支持编辑单元格和添加行。删除我不太关心的内容。
我试图用某种形式的getElementBy进行复制，但惨败。
尝试自动添加下一行中的按钮也不起作用。
这是codepen。
任何意见都将不胜感激。
<html><head>
<meta http-eq
浏览 1提问于2020-09-10得票数 0
我已经用JQuery在我的表格中的每一行动态创建了更新按钮，成功地编辑了表格，但我不知道如何调用php函数来更新数据库。 我使用juery作为 $(document).ready(function () {
$('.editbtn').click(function() {
var $this = $(this);
var tds = $this.closest('tr').find('td').filter(function() {
return $(this).find('.editbtn&
浏览 9提问于2019-02-10得票数 0
2回答
我在海边是个乞丐。
我有一个表格(就像一个电子表格)，它使用PostgreSQL数据库中的车库驱动程序来获取数据。
我将contenteditable=true放到tableData中，我可以修改它，但它不会更新数据库中的条目。
我不想使用一个获取数据然后在单击submit之后运行查询的表单，我只想修改电子表格单元格( html表格数据标记)，然后当我按enter (或者我只是从单元格上取下鼠标)时，我想运行一个更新数据库的查询。
我试过使用jQuery和Ajax，但我无法使它工作。我无法获得我输入的数据和描述单元格的数据，因此我可以运行查询。
html tableData
attribut
浏览 11提问于2019-11-11得票数 1
回答已采纳
我想在jquery中的数组中选择一个特定的元素，得到类似的类。我的目的是编辑每一行，然后用Ajax动态地更改它们。第一步是使用选择所有行。
我的代码如下：
<?php foreach ($database as $item): ?>
<tr class="row_<?php echo $item["id"]; ?>">
<th id="id_<?php echo $item["id"]; ?>"><?php echo $item["id"]; ?&g
浏览 1提问于2018-05-09得票数 0
回答已采纳
我有一个链接和一个contentEditable div。该链接具有onclick属性。当我复制链接并将其粘贴到contentEditable div时，onclick属性被删除。是否有保留contentEditable中的属性？
详细信息
片段
<html>
<head>
</head>
<body>
<a href="#" onclick="handleClick()">Click me</a>
<div
浏览 0提问于2018-05-19得票数 1
回答已采纳
2回答
我正在使用PHP、jquery和AJAX创建一个多行插入表。这样，用户就可以从表中添加更多行或删除行。
有人能帮我在列中创建一个下拉列表吗？我在表中有4列，我希望在项目名称上下拉式。我正在附上这张桌子的扣子。请帮帮我，伙计们，我是初学者。
[<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Testing</title>
<script src="http
浏览 0提问于2018-06-06得票数 1
回答已采纳
我有一张表，它的列是可编辑的。当我使用中的示例来使表格中的行可拖动时。
contenteditable属性不起作用。这是
如果您注释掉javascript，您可以看到列year是可编辑的，但是如果您想添加javascript以使行可拖动，那么year列是不可编辑的，尽管属性"contenteditible = 'true‘在页面源代码中。
下面是我的html以供参考：
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<table id=&#
浏览 46提问于2018-06-02得票数 0
回答已采纳
我的第一个问题是，当我从输入字段和div获取文本时，输入字段文本是可以的，但是div文本显示了额外的CSS样式。请看截图。
<input id="accordion_input" type="text">
<div id="editableDiv" contenteditable=""></div>
第二个问题是，当我单击'Add‘按钮时，输入和div文本只出现一次。我想通过点击按钮来多次添加文本。
$(document).ready(function() {
$(&
浏览 0提问于2018-10-17得票数 2
回答已采纳
我得到了一个页面，它允许用户更改div中的文本并将html代码保存到数据库中，但是当我显示回html代码时，我希望将div contenteditable更改为false。有没有办法？
<link href='http://fonts.googleapis.com/css?family=Permanent+Marker' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Ultra' rel
浏览 0提问于2013-06-08得票数 17
回答已采纳
我遇到了一个意想不到的行为，我的contenteditable属性的角度。我有一个带有HTML的对象，存储为一个值：
public json_html = {
"button1":"<p contenteditable='true'>first section</p>",
"button2":"<p>second section</p>",
"button3":"<p>third section</p>
浏览 1提问于2018-01-28得票数 1
回答已采纳
$mydiv的子元素是可编辑的。我想将html保存到db中，并期待较小的html。以下属性删除不起作用。 如何让它工作？ let big_html = $mydiv.html();
$mydiv.children().each(function () {
$(this).removeProp('contenteditable'); // Not work!
});
let small_html = $mydiv.html();
浏览 18提问于2019-12-28得票数 2
回答已采纳
2回答
我有一个html表，它可以使用jquery进行排序。然后，我添加了一个桌子，作为垃圾桶。出于美观的原因，我只希望在用户拖动表行时看到垃圾桶。为此，我在活动事件上创建表行，并删除表行--停用事件。但是，我注意到，当项目被拖到垃圾桶中时，它不再会删除该项目。我试图通过使用settimeout来修复这个问题，这样在表不正确之前就会有一个延迟，但是这是行不通的。
我还想知道我可以修复它，以及如何使它下降而不是立即弹出()，并移动回而不是消失(相反的例子)。
我有一个，这里也是表的html：
<table class="table" id="tableDevices"
浏览 6提问于2015-07-29得票数 3
回答已采纳
2回答
我正在开发一个HTML，它的值为contenteditable，值true封装在div中，其中包含可内容的false。HTML结构是：
<div contenteditable=false>
<div contenteditable=true>
<p>Abc</p>
<p>Def</p>
</div>
</div>
JSFiddle链接：
复制步骤:打开Chrome
在@之后单击与文本“Def”一致
现在点击后面的@与文本'Abc‘。光
浏览 1提问于2015-11-26得票数 4
回答已采纳
1回答
我正在为使用contenteditable的客户端开发一些基本的富文本编辑功能。其中一个特性要求更改按钮的data-*属性值，例如<button data-type="telephone">Text</button>
我在下面创建了一个最小的示例--这将创建一个contenteditable区域，然后jquery尝试在将更新后的<button>打印到#output div之前更新#output。
<!doctype html>
<html>
<head>
<meta charset="utf-
浏览 2提问于2019-07-26得票数 0
回答已采纳
我有一个文件，它有很多带有contenteditable="true"属性的标记。我还在其中添加了很多jquery/js。
我想要实现的是：
让用户用contenteditable属性修改内容-> ok
让用户下载修改后的文件-> ok和下面的片段
单击“下载”按钮时，删除“删除”和“删除结束”注释之间的所有内容，并删除所有"contenteditable="true"属性-> not
我还发现这个下载片段比我在下面的片段中使用的要短得多，但是不知道哪个更好，哪个更安全？
<a onclick="thi
浏览 7提问于2022-03-10得票数 1
回答已采纳
2回答
我有一个使用HTML5标签contenteditable的编辑器，我在contenteditable里面使用span，当我删除所有文本时，span也被删除了，但是我希望span不应该被删除，如何防止呢？
我的密码：--
$('#editor').keyup(function(){
$('#spanText').text($(this).find('span').text());
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquer
浏览 4提问于2020-02-06得票数 2
回答已采纳
1回答
我有一个可满足的div：
<div class="one" contenteditable="true">A</div>
如果用户在可内容编辑的div中输入HTML、CSS或Javascript标签，我如何使其语法突出显示？
因此，当用户输入变量、标签等时，它们是用颜色编码的
浏览 0提问于2015-08-08得票数 1
我在这里挣扎着想要找到一个解决办法
使用contenteditable的div
PHP
<div class="panel-body">
<div contenteditable="true" style="text-align: justify" id="text_data_1">
<?php echo(html_entity_decode($text_data_from_backend))?>
</div>
</di
浏览 9提问于2017-07-06得票数 1
回答已采纳
3回答
我试图在jquery中创建一个自定义jquery，因为我使用的是一个contenteditable attribute.But，我可以在开始键入文本时删除placeholder，但是当我试图删除文本时，它不能工作。
HTML
<div class="FormDescriptionContainer">
<div class="FormDescriptionPlaceholder">Iam a placeholder</div>
<p class="FormDescription" cont
浏览 0提问于2016-08-25得票数 0
回答已采纳
2回答
我有一个使用renderer2动态生成的HTML5表：
const td = this.renderer.createElement('td');
this.renderer.setProperty(td, 'id', letter + i);
this.renderer.setAttribute(td, 'contenteditable', 'true');
this.renderer.setAttribute(td, 'r', i + '');
this.renderer.setAttribut
浏览 3提问于2019-09-30得票数 1
回答已采纳
1回答
我以为我能做到
$('body').on('focus', '[contenteditable]', e => {
var self = $(e)
self.data('before', self.html())
return self
})
但它的意思是：“不能读取未定义的属性'createDocumentFragment‘”
$('body').on('focus', '[contenteditable]', my
浏览 0提问于2017-08-30得票数 1
回答已采纳
为了用contenteditable区域和Meteor修复文本复制错误，我做了以下工作：
document_page.js:
Template.documentPage.helpers({
contenteditable: function() {
return '<div class="content" contenteditable="true">' + this.content + '</div>'
},
document_page.html:
<div class="
浏览 6提问于2015-01-28得票数 0
回答已采纳
我有下面的HTML。
基本上，它是一个包含文本的可内容可调整的div。
在div中还有另外两个用户可以单击的div。
<div class="test" contenteditable="true">Text
<div class="color-picker">
<img src="/style/icons/color_swatch.png" alt="Color picker" title="Pick a color">
</div>
浏览 3提问于2010-12-09得票数 1
回答已采纳
我有个片段：
<div contenteditable="true"> father
<a contenteditable="false" href="#"> myLink </a>
</div>
我的问题是如果我把插入符号放在后面
</a>
我试着为移除myLink html标签留出空间，它在火狐中不起作用，但它在合唱团、歌剧、狩猎和探险家中工作。另一方面，如果在firefox中我选择
<a contenteditable="false" href=
浏览 1提问于2011-12-31得票数 2
我正在尝试一种发票系统，html看起来如下所示：
<invoice>
<headers>
<div date contenteditable>15-Jan-2020</div>
<div buyer contenteditable>McDonalds</div>
<div order contenteditable>145632</div>
</headers>
<item>
<div name contenteditable
浏览 4提问于2020-01-18得票数 0
回答已采纳
背景
尝试使用可编辑的内容<div>编辑有序列表。希望粘贴任何内容、键入任何内容或删除任何内容，并且始终显示至少一个有序列表项，但从不显示任何其他类型的文本(例如，没有空行、没有引用文本、没有缩进、没有Microsoft Word中的字体等等)。
使用jQuery 1.9.1支持尽可能多的浏览器。有下面的源代码。
代码
JavaScript (jQuery)：
$(document).ready(function() {
$('.directions > ol').prop('contentEditable','true')
浏览 6提问于2013-09-30得票数 0
回答已采纳
我有一个HTML页面及其相关的js文件。其目的是将插入到表中的数据转换为JSON文件。用户可以编辑表格单元格，然后单击按钮，使Javascript文件解析数据并将其作为Ajax请求发送到服务器上的PHP文件。然后，PHP文件将数据作为文件存储在服务器上，并将链接发回。对于标记，我需要使用val()而不是text()来获得所选的值。但是，val()返回一个空字符串。如何使它正确地返回值？
var $TABLE = $('#table');
var $BTN = $('#export-btn');
var $EXPORT = $('#export'
浏览 0提问于2018-10-02得票数 0
回答已采纳
如何根据单击按钮/链接来启用或禁用div上的ckeditor.inline。
这就是我在jquery中实现它的方法，但使用angular无法解决。
$('.toggle-edit').click(function(e){
var id_editedDiv = $(this).data('editTarget');
var editedDiv = '#' + id_editedDiv;
if( $(editedDiv).attr('contenteditable') == 'true' )
{
浏览 0提问于2016-08-18得票数 0
这是我第一个关于stackoverflow的问题，但是为了解决其他问题，我在这里跑了很多次，但是我找不到一个答案:我如何在一个火狐扩展的xul文件中创建一个div contentEditable？
-The下面是我的.xul文件的一部分，其中包含我想要的contentEditable目录：
<page id="sbEmptySidebar" title="&emptysidebar.title;"
xmlns:html="http://www.w3.org/1999/xhtml">
<vbox flex=
浏览 0提问于2011-06-25得票数 0
回答已采纳
我有一个重复呈现div的php for循环。 这是用于loop.Here的$checkboxitemsafterstripper是一维数组 foreach( $checkboxitemsafterstripper as $key => $item ){
echo ' <form id="'.$item.'form"><div class="div-table" id="'.$item.'">
<div class="div-tabl
浏览 13提问于2020-12-14得票数 1
在更改contenteditable span中的html后，我正在尝试重置光标位置。为此，我克隆当前范围，然后设置html，然后清除范围，然后添加范围，最后折叠。但是当我改变html时，克隆的范围就被重置了！这让我相信克隆的范围实际上不是一个深度拷贝，否则，为什么更改html会影响它呢？我认为我可以手动复制所有属性，但这听起来很痛苦。无论如何，复制范围的正确方法是什么？ $("#myText").on("input", function() {
var temp = window.getSelection().getRangeAt(0).cloneR
浏览 24提问于2019-05-27得票数 1
我有以下html：
<div id="content" contenteditable="true" style="font-family: Helvetica;">
Some text
<div id="cursor" contenteditable="true"></div>
Some other text.
</div>
现在我想将光标设置在一些文本之后(确切地说是在#cursor中)。两种方法我都试过了：
$('#cursor&
浏览 0提问于2013-05-26得票数 1
回答已采纳
2回答
我有一个CONTENTEDITABLE div，在那个div里面我有一个CONTENTEDITABLE span，我想要做的是能够处理内部SPAN上的onkeypress事件。
因此，javascript代码将是：
$(function()
{
$('#someid').keypress(function(event){alert('test');});
});
而HTML内容将是：
<div id="mydiv" contenteditable="true">
editable follows:<spa
浏览 0提问于2011-02-22得票数 6
回答已采纳
我正在尝试弄清楚如何将SQL DB写到我的文件中，这些文件主要是javaScript和JQuery。我在网上找到了一些php信息，但我在把php和其他东西放入我的代码时遇到了麻烦。我尝试使用一个数组，将用户输入的信息放入html表中，并调用一个使用该数组作为参数的方法。我已经把我的整个文件变成了一个php文件，但是在不让我的bigTableRows数组离开作用域或者其他运行时错误消息的情况下，我找不到把php <?php ?>分隔符放在哪里的问题。在我弄清楚这一点后，我需要做一个MS SQL写。现在，我看到了这个错误消息，但没有表格。第83行是<?php之后的行，其中我有ec
浏览 1提问于2014-06-10得票数 0
2回答
在一些javascript的帮助下，我正在做一个简短简单的html测验。问题是，我不想使用<input>来接受答案，我正在寻找替代方案。javascript根据标签ID运行输入。是否可以使用另一个带有contenteditable的标签。我希望框中显示“在此处键入答案”。如果javascript检查ID1，我能得到类似这样的东西吗？
<p id="id1" contenteditable="true">Type answer here</p>
而不是
<input type="text" id="
浏览 0提问于2012-10-01得票数 0
回答已采纳
3回答
我有"contenteditable“div元素。我想为它设置一个水印，这样当用户试图在div中编写一些东西时，水印应该会消失。
我尝试了一些水印jQuery插件，都支持输入，文本区域。在contenteditable div中实现这个特性的方法是什么？
浏览 2提问于2012-03-04得票数 1
回答已采纳
1回答
我的应用程序中有一个HTML元素，如下所示：
<div id="DivId" contenteditable="true" style="border:1px solid black"></div>
我需要限制可以在div中输入的字符数。就像将maxlength属性赋予textbox一样。我该怎么做？如果我不使用JavaScript或jQuery就能做到这一点，那将是非常有帮助的。
浏览 3提问于2014-02-19得票数 0
在contentEditable-DIV中，我尝试将HTML-Code从strat-Position 0获取到用户单击的end-position。
<div id="MyEditableId" contentEditable="true">
1. Some text 123. <span style="background-color: #0CF;">text 123</span> 456 <span style="background-color: #9F3;">2->
浏览 0提问于2014-10-15得票数 0
我有以下div：
<div id="txt_reporter" contenteditable="true">I am contents</div>
以及下面的jquery：
<script>
$('#submit_inc').click(function(e) { e.preventDefault();
$('#dynamic_content').html('Submitting...');
var txt_reporter = $('#txt_rep
浏览 0提问于2017-08-16得票数 0
此HTML：
<div class="editable" contentEditable="true">
<span class="empty">change me</span>
</div>
和这个JQuery：
$(".empty").click(function() {
$(this).css("color","#000");
$(this).html(" ");
浏览 2提问于2012-08-06得票数 0
回答已采纳
我正在尝试在jquery ajax中设置url，如下所示
$.ajax({
url : "{{url('addtocart')}}",
type : "POST",
data : {_token: CSRF_TOKEN, username:username, userType:userType,
table_no:table_no, order_no:order_no, cname:cname,
tname:tname, dname:dname, dish_qty
浏览 2提问于2016-05-03得票数 0
代码概述：这段代码由一个可编辑的div部分组成。在div下面有一个按钮，它创建span元素，在span元素中插入文本“标记”，最后在可编辑的div中追加span元素。
<!DOCTYPE html>
<html>
<head>
<title></title>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></scr
浏览 4提问于2017-09-03得票数 3
回答已采纳
我目前正在使用contenteditable="true“来创建一个突出显示的语法输入框。我正在编写一个jquery插件，它将<input>标记转换为<div contenteditable="true">容器。详细地说，它隐藏<input>并在其后面插入<div>容器。
在我的小提琴中，突出显示功能只是一个简单的替换函数，用于突出显示所有的内容，并且位于容器中。
如果容器的内容被更改，插件必须
将内容与输入的内容同步，更新突出显示的语法
在我的例子中，我只是在听keyup事件。现在，当我想更新容器的语法高亮显示时，出现
浏览 1提问于2011-11-07得票数 4
回答已采纳
1回答
我有几个关于HTML5 ContentEditable和ContentEditable的问题，如果你能给我提供我想要做的事情的例子，我会很高兴的，这样我就能有一个想法了。
我有一个我想编辑的网站，但是只有在"Admin“被登录的情况下，我才能做事情的登录端，但我不确定如何在”Admin“未登录时将HTML5 ContentEditable编码到其中，这样它就不会在”Admin“登录时加载。如何保存在HTML5 中更改的内容？
浏览 1提问于2011-03-07得票数 2
回答已采纳
1回答
我在inside中注意到了这个问题，插入符号的位置和范围在可编辑的内容中不匹配或错。
$("#c").click(function(e) {
var sel = window.getSelection();
var range = sel.getRangeAt(0);
$("#res").get(0).textContent = "START_OFFSET:" + range.startOffset + "->" + range.startContainer.innerHTML;
console.lo
浏览 4提问于2017-10-18得票数 3
回答已采纳
5回答
选择没有父类的元素
、、、
$("#result").html($('[contenteditable]').text());
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="scorer">
<div>
<div contenteditable>1</div>
<div contenteditable&
浏览 10提问于2015-09-24得票数 0
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
即时通信 IM
实时音视频活动推荐
腾讯云开发者
