当前位置：文江博客话题详情

如何重新创建Google记录

发布于 2025-01-27 09:28:21 字数 640 浏览 2 评论 0 原文

我试图为学校项目创建自己的笔记。而且我遇到了一些问题，我正在使用可满足的笔记部分，并自动生成Divs。我试图用不错的运气删除它们。

html

<div id="main" contenteditable="true"></div>
<script type="text/javascript" src="static/js/note.js"></script>

javascript

$('#main').on('DOMSubtreeModified', function(){
        $('#main > div').children().unwrap();
    });

在此代码中，您必须两次按空格，但更大的问题是，当您尝试在下面的文本上方创建新线条时，下面所有文本都将被删除。

也尝试使用替换：

$("#main div").replaceWith("<br> ")

我尝试使用许多不同的选项，例如替换Enter时替换...

原文

I tried to create my own notes for the school project. And I ran into some problems, I am using contentEditable for the note-taking part and it auto-generates divs. I tried to remove them with not much luck.

Html

<div id="main" contenteditable="true"></div>
<script type="text/javascript" src="static/js/note.js"></script>

JavaScript

$('#main').on('DOMSubtreeModified', function(){
        $('#main > div').children().unwrap();
    });

In this code, you have to press space twice but the bigger problem is when you try to create a new line above the text all the text below gets deleted.

also tried using replace:

$("#main div").replaceWith("<br> ")

I tried using many different options like replacing when enter got pressed...

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

残月升风 2025-02-03 09:28:21

有了一点研究，我发现...

在上使用可满足的不同的浏览器在很长一段时间内一直很痛苦。例如，即使您按Enter/return在主要浏览器中进行了不同的处理方式，即使您按Enter/return创建新的文本系列时会发生的事情（Firefox插入＆lt; br＆gt; 元素，，即/opera使用＆lt; p＆gt; ，chrome/safari使用了＆lt; div＆gt; ）。

幸运的是，在现代浏览器中，事物更加一致。从Firefox 60开始，Firefox将被更新以将单独的线包装在＆lt; div; div; 元素中，与Chrome，Modern Opera，Edge和Safari的行为匹配。

如果要使用不同的段落分隔符，则上述浏览器所有支持 document.execcommand ，它提供 defaultParagragragraphaphaphaphaphateparator 命令允许您更改它。例如，要使用＆lt; p＆gt; 元素：

document.execCommand("defaultParagraphSeparator", false, "p");

此外，Firefox支持非标准参数， br ，用于 defaultParagragragraphSeparator ，因为Firefox 55。如果您的Web应用程序期望较旧的Firefox行为，并且您不想或没有时间将其更新以使用新行为，这将很有用。您可以在此行中使用较旧的Firefox行为：

document.execCommand("defaultParagraphSeparator", false, "br");

您可以看到以获取更多信息。

With a little research, I found out...

Use of contenteditable across different browsers has been painful for a long time because of the differences in generated markup between browsers. For example, even something as simple as what happens when you press Enter/Return to create a new line of text inside an editable element was handled differently across the major browsers (Firefox inserted <br> elements, IE/Opera used <p>, Chrome/Safari used <div>).

Fortunately, in modern browsers things are somewhat more consistent. As of Firefox 60, Firefox will be updated to wrap the separate lines in <div> elements, matching the behavior of Chrome, modern Opera, Edge, and Safari.

If you want to use a different paragraph separator, the above browsers all support document.execCommand, which provides a defaultParagraphSeparator command to allow you to change it. For example, to use <p> elements:

document.execCommand("defaultParagraphSeparator", false, "p");

Additionally, Firefox supports the non-standard argument, br, for defaultParagraphSeparator since Firefox 55. This is useful if your web application expects the older Firefox behavior, and you don't want to or don't have the time to update it to use the new behavior. You can use the older Firefox behavior with this line:

document.execCommand("defaultParagraphSeparator", false, "br");

You can see MDN web docs for more informations.

回复收藏 0 原文

青瓷清茶倾城歌 2025-02-03 09:28:21

<body>
    <div id="main" contenteditable="true"></div>
    <script type="text/javascript">
        $('#main').on('DOMSubtreeModified', function(){
        $('#main > div').children().unwrap();
    });
    </script>
</body>

您的代码正常工作，＆lt; div＆gt; 标签正在删除。尝试使用其他版本的 jquery ，我使用

<script src="https://code.jquery.com/jquery-3.6.0.js" integrity="sha256-H+K7U5CnXl1h5ywQfKtSj8PCmoN9aaq30gDh27Xc0jk=" crossorigin="anonymous"></script>

<body>
    <div id="main" contenteditable="true"></div>
    <script type="text/javascript">
        $('#main').on('DOMSubtreeModified', function(){
        $('#main > div').children().unwrap();
    });
    </script>
</body>

Your code is working fine, the <div> tags are being removed. Try using a different version of jQuery, I use

<script src="https://code.jquery.com/jquery-3.6.0.js" integrity="sha256-H+K7U5CnXl1h5ywQfKtSj8PCmoN9aaq30gDh27Xc0jk=" crossorigin="anonymous"></script>

回复收藏 0 原文

~没有更多了~