设置summernote默认为斜体

Posted 2023-03-22

【中文标题】设置summernote默认为斜体

【英文标题】：Setting summernote to be italicised by default

【发布时间】：2017-04-09 07:25:28

【问题描述】：

所以我有一系列的 Summernote 输入，我希望默认为斜体。我只想要斜体按钮选项，所以我删除了所有其他按钮。

Image of multiple summernote entries

生成这些的 html：

<div style="width:250px;">
     <div class="summernote" id="[e-mail]_ID">
          @Html.HiddenFor(model => model.Answer, htmlAttributes: new  id = "Answer_" + @Model.ST_ID)
      </div>
</div>

--

$(document).ready(function () 
     $('.summernote').summernote(
          toolbar: [
               ['style', ['italic']],
          ],
          onChange: function (e) 
               // Do some event
               // Update the HiddenFor element with the formatted text
          
     );
);

斜体按钮的位置由 CSS 设置。

我想将所有输入设置为默认斜体。

我试过了：

$('.summernote').summernote('italic');

根据Summernote - Deep Dive

它设置第一个输入，但不设置其他任何输入。

然后我尝试了

$('.summernote').each(function() 
     $(this).summernote('italic');

它只是没有做任何事情......

我也试过了：

var elements = document.GetElementsByClassName('summernote');
for (i = 0; i < elements.length; i++) 
    $(elements[i]).summernote('italic');

运气不好。

有什么想法吗？？

【问题讨论】：

你有一些 html 可以让我们看看吗？

@NeilDocherty 我已经用 html 更新了我的初始帖子。

这是pen。

@Ricky - 谢谢，但这是为了解决我的问题吗？

@DavidDerry 是的，但我必须离开，只是提供一个起点。

【参考方案1】：

显然除了手动单击工具栏中的斜体按钮之外似乎没有其他选择：

  $(".note-btn-italic").trigger("click");

---

$(document).ready(function() 
  $('.summernote').summernote(
    toolbar: [
      ['style', ['italic']],
    ]
  );
  $(".note-btn-italic").trigger("click");
);

<link href="http://netdna.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.css" rel="stylesheet" />
<script src="http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.4/jquery.js"></script>
<script src="http://netdna.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.js"></script>
<link href="http://cdnjs.cloudflare.com/ajax/libs/summernote/0.8.2/summernote.css" rel="stylesheet" />
<script src="http://cdnjs.cloudflare.com/ajax/libs/summernote/0.8.2/summernote.js"></script>

<div style="width:250px;">
  <div class="summernote" id="[e-mail]_ID"></div>
</div>

【讨论】：

它适用于一个summernote条目，但是当我添加多个时它会中断codepen.io/anon/pen/worpga