Kendo UI for jQuery使用教程：銷毀小部件

【Kendo UI for jQuery最新試用版下載】

Kendo UI目前最新提供Kendo UI for jQuery、Kendo UI for Angular、Kendo UI Support for React和Kendo UI Support for Vue四個控件。Kendo UI for jQuery是創建現代Web應用程序的最完整UI庫。

所有Kendo UI小部件都提供destroy方法。

destroy方法：

• 刪除窗口小部件實例（客戶端對象）。 因此窗口小部件不再可訪問，并且其所有事件處理程序都停止工作。
• 刪除自動生成的HTML內容，該內容位于窗口小部件之外 - 例如，分離的彈出窗口和下拉列表。窗口小部件的主要HTML保持不變，如果需要，您必須手動將其從DOM中刪除。 Window小部件是一個例外，因為它自己代表一個分離的彈出窗口。
• 借助kendo.destroy（）方法銷毀所有子窗口小部件。

Kendo UI提供以下用于銷毀小部件的選項：

• 手動銷毀小部件
• 自動銷毀小部件
• 銷毀通過MVVM模式創建的小部件
• 銷毀多個小部件

手動銷毀小部件

您可能需要在以下可能的情況下手動銷毀小部件：

• 不再需要小部件。
• 該小部件放置在容器內，該容器將通過Ajax請求或DOM替換進行更新。 在這種情況下，強烈建議銷毀嵌套小部件以防止內存泄漏或其他意外的副作用。
• 必須徹底更改窗口小部件設置和操作，這是通過可用的API方法無法實現的。

注意：避免從被破壞的小部件的剩余部分創建新的小部件實例。 要初始化新窗口小部件，請使用不同的新添加的DOM元素。 在某些情況下，還可以清空窗口小部件容器并從空元素初始化新實例。

以下示例演示如何銷毀和刪除Kendo UI Grid小部件。

<div id="grid"></div>
<script>
  $("#grid").kendoGrid( { /* configuration */ } ); // Create a Grid widget.
$("#grid").data("kendoGrid").destroy(); // Destroy the Grid.
$("#grid").empty(); // Empty the Grid content (inner HTML)
  // or
  $("#grid").remove(); // remove all Grid HTML.
  </script>

自動銷毀小部件

卸載網頁時會自動銷毀Kendo UI小部件。

銷毀MVVM創建的小部件

要正確銷毀通過Kendo UI MVVM機制聲明性創建的小部件：

1. 使用kendo.unbind（）方法刪除與窗口小部件相關的任何MVVM綁定。
2. 為相應的容器調用kendo.destroy（），或者在此容器內調用每個窗口小部件的destroy（）方法。

銷毀多個小部件

除了銷毀特定的Kendo UI小部件之外，Kendo UI框架還提供了一個kendo.destroy（）方法，該方法可以銷毀放置在特定容器內的多個小部件。

掃描關注慧聚IT微信公眾號，及時獲取最新動態及最新資訊