|
|
Pubblicato su 17/04/2015 16:20:20
|
|
|
Dopo due giorni, Ckeditor e Ckfinder hanno finalmente integrato la funzione di caricamento immagini.
Qui scriverò della mia esperienza.
Per implementare il modulo di editing delle notizie, mio fratello mi ha fatto conoscere Ckeditor.
Prima di tutto, scarica la versione .net di Ckeditor su http://ckeditor.com/, sto usando ckeditor_aspnet_3.6.4 qui.
Dopo il download, aprilo. Ma non tutto qui è utile, quindi puoi metterlo
dove il campione è un esempio, e la sorgente è il file sorgente
, eliminato direttamente
, lo scopo è ridurre il volume dell'editor. Poi copia l'intera cartella direttamente nella directory principale del sito. Citazione
ckeditro.net.dll
Nell'intestazione della pagina dove devi usare il controllo editor:
<scrip remove t src="/ckeditor/ckeditor.js" type="text/javascrip remove t" ></scrip去掉t>
<scrip remove t type="text/javascrip remove t" >
window.onload = funzione () {
CKEDITOR.replace("txtContent");
}
. .</scrip去掉t>
Corpo
：
<CKEditor:CKEditorControl ID="CKEditor1" BasePath="~/ckeditor/" runat="server">
</CKEditor:CKEditorControl>
Anche il codice di background è semplice:
articolo. ARTICLECONTENT = CKEditor1.Text; Questo assegna il contenuto modificato al campo ARTICLECONTENT della classe modello dell'articolo.
E con questo, il mio editor è stato completato con successo!
Ma è risorso un grosso problema: Ckeditor non ha la possibilità di caricare immagini, il che è davvero un problema di testa. Come si fa? Vai a Baidu.
Appena sono andato online, ho scoperto che ci sono molti modi per risolverlo, alcuni dicono che consiste nel creare una funzione di caricamento di un'immagine fuori dall'editor, poi passare il percorso del link del server al cursore corrente dell'editor quando viene passato al server, poi implementarlo, farlo, e improvvisamente scopri che quando clicchi sull'immagine di upload esterna, il cursore non è affatto nell'editor, cosa dovrei fare??? Pensateci, ahimè, con le conoscenze attuali, non ce la faccio, posso solo arrendermi. (Se qualche dio lo sa, lascia un messaggio per dirmelo, grazie); Alcuni dicono che si scriva il proprio JS per implementare questa funzione, e poi si collega all'editor per completarla, e ci sono molti articoli simili:
1、 http://www.cnblogs.com/lts8989/archive/2011/08/04/2127326.html
2、 http://www.cnblogs.com/striiiiing/archive/2012/08/15/2640792.html
Penso che questi due articoli siano piuttosto validi, ma la mia conoscenza di JS è debole, quindi ho provato a scriverli, ma comunque non sono riuscito a implementarlo con successo.
Beh, sembra che io possa usare Ckeditor solo per integrarmi con Ckfinder, e davvero non volevo usare Ckfinder perché è caricato, il che non è una buona cosa!! Ma qual è il problema? È meglio non essere sotto il sito ufficiale, sono andato direttamente alle risorse su Internet, beh, finalmente ne ho trovata una che forniva risorse molto dettagliate (qui vorrei ringraziare alcuni fratelli!!) Sito web: http://download.csdn.net/download/q8347901/3887066 (Ci sono anche articoli introduttivi dettagliati su Ckeditor e Ckfinder qui, molto ottimi!) ）
Scarica Ckfinder, poi copia il file ckfinder.dll dalla directory /bin alla directory bin del sito, copia la directory ckfinder nella directory root del sito (puoi scegliere un altro percorso) e fai riferimento alla ckfinder.dll
Configura questo:
Se sei sulla pagina .aspx che vuoi fare ckeditor, è la seguente:
CKEDITOR.replace ('Riquadro di testo che vuoi abilitare per modifica',
{
filebrowserBrowseUrl:'/ckfinder/ckfinder.html',//启用浏览功能
filebrowserImageBrowseUrl:'/ckfinder/ckfinder.html?Type=Images',
filebrowserFlashBrowseUrl:'/ckfinder/ckfinder.html?Type=Flash',
filebrowserUploadUrl:'/ckfinder/core/connector/aspx/connector.aspx?command=QuickUpload&type=Files',
filebrowserImageUploadUrl:'/ckfinder/core/connector/aspx/connector.aspx?command=QuickUpload&type=Images',
filebrowserFlashUploadUrl:'/ckfinder/core/connector/aspx/connector.aspx?command=QuickUpload&type=Flash'
}
);
Naturalmente, usa il metodo della configurazione globale
Configura in config.js del plugin Ckeditor
config.filebrowserBrowseUrl="/ckfinder/ckfinder.html";
config.filebrowserImageBrowseUrl="/ckfinder/ckfinder.html? Tipo=Immagini";
config.filebrowserFlashBrowseUrl="/ckfinder/ckfinder.html? Tipo=Lampo";
config.filebrowserUploadUrl="/ckfinder/core/connector/aspx/connector.aspx?command=QuickUpload&type=Files";
config.filebrowserImageUploadUrl="/ckfinder/core/connector/aspx/connector.aspx?command=QuickUpload&type=Images";
config.filebrowserFlashUploadUrl="/ckfinder/core/connector/aspx/connector.aspx?command=QuickUpload&type=Flash";
Dopo la configurazione, modifica il config.ascx in ckfinder
CheckAuthentication()in Return true, altrimenti non verrà caricato e richiede verifica
Il percorso verso BaseUrl in SetConfig() è il percorso per caricare
Inoltre, dopo aver prestato attenzione, non dimenticare di consultare il file BLL in ckfinder
Bene, la tua integrazione e il caricamento delle immagini sono stati completati con successo.
In alternativa, se vuoi nascondere le schede Hyperlinks e Advanced nel pannello Immagini, puoi farlo nei plugin/immagini/dialoghi/dialoghi di CKEditor image.js
Cerca "Link" e "advanced" in "id:'Link'" e "id:'advanced'", e aggiungi "hidden:true", fallo e basta.
Se vuoi migliorare l'aspetto e ottimizzare il tuo sito web, dai un'occhiata ad alcuni dei seguenti articoli.
1、 http://www.cnblogs.com/netec/archive/2009/11/02/ckeditor_ckfinder.html
2、 http://blog.csdn.net/lulu_jiang/article/details/5532345
3、 http://blog.csdn.net/hzq1074/article/details/5893475 |
Precedente:asp.net Editor di testo (FCKeditor)Prossimo:SQL Server determina se ci sono database, tabelle, colonne e viste
|
