ホームページ > 記事 > ウェブフロントエンド > VS2013 での ASPNET Web サイト開発で xheditor v1.1.13 を HTML editor_html/css_WEB-ITnose として使用する
vs2013 を使用してブログ Web サイト、.net Framework 4 を開発するには、記事を書くためのツールとして HTML エディターが必要です。何度も試行した結果、dotnettextbox と kceditor が除外されました。 xheditor は良いと思うので、次のように使用方法を記録します:
1. http://download.csdn.net/download/chenhaoying/4274663 にアクセスしてダウンロードすると、「xheditor」という名前のファイルが得られます。 asp.net の -1.1.13 .rar」ファイルを使用します。
2. vs2013 を使用して、任意の Web サイト名を付けます。この例は、以下に示すように、Test4hxEditor です。
3. .rar ファイル内の xheditor_emot フォルダーと xheditor_skin フォルダー、および xheditor-1.1.13-zh-cn.min.js および jquery-1.4 を使用して、asp.net で xheditor-1.1.13 を使用します。 2 つの min.js ファイルを Web サイトがあるフォルダー「d:Quick Disk Test4hxEditor」に解凍します。
4. vs2013 に TestfhxEditor の Web フォームを追加します (この例では Default という名前)。
5. vs2013 で Default.aspx ファイルを開き、変更によって追加された内容を太字で示します。以下に示すように:
<pre name="code" class="plain"><%@ Page Language="C#" AutoEventWireup="true" ValidateRequest="false" CodeFile="Default.aspx.cs" Inherits="_Default" %><!DOCTYPE html><html xmlns="http://www.w3.org/1999/xhtml"><head runat="server"><meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <title></title> <script type="text/javascript" src="jquery-1.4.4.min.js"></script> <script type="text/javascript" src="xheditor-1.1.13-zh-cn.min.js"></script> <script type ="text/javascript"> $(document).ready(function () { $('#elm1').xheditor({ tools: 'GStart,Fontface,FontSize,Blocktag,Bold,Italic,Underline,Strikethrough,FontColor,BackColor,Removeformat,Separator,Align,List,Outdent,Indent,Separator,Cut,Copy,Paste,Pastetext,Separator,Link,Unlink,Img,Emot,Table,Separator,About,GEnd', skin: 'default', showBlocktag: false, internalScript: false, internalStyle: false, width: 600, height: 300, loadCSS: 'http://xheditor.com/test.css', fullscreen: false, sourceMode: false, forcePtag: true, upImgUrl: "pictures", upImgExt: "jpg,jpeg,gif,png" }); }); </script> </head><body> <form id="form1" runat="server"> <div> <textarea runat="server" id="elm1" name="content" rows="20" cols="100"></textarea> <asp:Label ID="Label1" runat="server" Text="Label"></asp:Label> <asp:Button ID="Button1" runat="server" Text="Button" OnClick="Button1_Click" /> </div> </form></body></html>
6. Default.aspx デザイン ビューの [ボタン] ボタンをダブルクリックして、Default.aspx.cs ファイルの編集インターフェイスに入り、次のように編集します。部分クラス _Default: System.Web.UI.Page
{ protected void Page_Load(object sender, EventArgs e)
{
}
protected void Button1_Click(object sender, EventArgs e)
Label 1.Text = elm1 .Value;
}
}
<span style="font-family: Arial, Helvetica, sans-serif;">7.在vs2013内打开Web.config文件,在<system.web></system.web>内增加如下内容:<httpRuntime requestValidationMode="2.0" />。如下所示。</span>
<span style="font-family: Arial, Helvetica, sans-serif;"> <system.web> <compilation debug="true" targetFramework="4.0" /> <httpRuntime requestValidationMode="2.0" /> </system.web></span>
8. ウェブサイトを実行します。エディタが表示されるので、内容を入力して編集完了後、「ボタン」をクリックすると編集内容がlabel1に転送されます。以下に示すように。
RREE RREE RREE RREE