1

我有一个剑道编辑器，定义如下：

 @(Html.Kendo().Editor()
          .Name("RestrictionsEditor")
          .Tag("div")
          .Tools(tools => tools
                .Clear()
                .Bold().Italic().Underline().Strikethrough()
                .JustifyLeft().JustifyCenter().JustifyRight().JustifyFull()
                .CreateLink().Unlink()
                .InsertImage()
                .TableEditing()
                .FontColor().BackColor()
          )
          .Value(@<text> This is the Kendo Editor and it has 
                    some anchor tags pointing to external webistes.</text>)

当我在编辑器中单击时，没有显示字体格式的顶部工具栏。我想在用户在编辑器内单击时显示顶部工具栏，然后在用户在编辑器外单击时隐藏工具栏。请帮忙！

谢谢！

4

1 回答 1

0

要显示隐藏工具栏，您首先需要将工具栏默认设置为隐藏，然后实现选择和模糊事件以显示和隐藏工具栏。

这是一个在 JavaScript 中实现它的小提琴。

对于您的 MVC 实现，您需要在页面中添加脚本标签并在编辑器初始化后附加事件。像这样的东西。

<script>
$(document).ready(function () {

  //hide toolbar by default
  $("#RestrictionsEditor").closest(".k-editor").find(".k-editor-toolbar").hide();

  //bind the select event
    $("#RestrictionsEditor").data("kendoEditor").bind("select", function(e){
    //show toolbar on selection
    $("#RestrictionsEditor").closest(".k-editor").find(".k-editor-toolbar").show();
  });

  //bind the blur event
  $("#RestrictionsEditor").on("blur", function(e){
    //hide toolbar
        $("#RestrictionsEditor").closest(".k-editor").find(".k-editor-toolbar").hide();
    });

});
</script>
于 2016-04-21T04:33:57.727 回答