Maison développement back-end tutoriel php exemple de méthode ueditor de l'éditeur Baidu intégré thinkphp3.2

exemple de méthode ueditor de l'éditeur Baidu intégré thinkphp3.2

Feb 07, 2018 am 10:28 AM
thinkphp3.2 编辑器

Cet article présente principalement l'exemple de code de thinkphp3.2 intégré dans l'éditeur Baidu. Il a une certaine valeur de référence. J'espère que cela pourra aider tout le monde.

Cet article présente thinkphp3.2 pour intégrer l'éditeur Baidu, partagez-le avec tout le monde, j'espère que cet article vous sera utile

En raison des exigences de composition, de nombreux nous avons parfois besoin d'intégrer un éditeur de texte enrichi et de générer du contenu textuel avec des balises HTML. Parce que j'ai récemment travaillé sur un système de gestion backend qui nécessite de modifier le contenu du texte afin qu'il puisse générer du texte avec des balises HTML et l'enregistrer sur le serveur. Le client envoie une demande pour obtenir le texte balisé du serveur. J'utilise ueditor,

et je le mets dans le répertoire Public.

2. Lorsque nous utilisons l'éditeur de texte enrichi dans la vue, nous ajoutons généralement une zone de texte au formulaire,


<form>  
<p><textarea name="intro_detail" id="intro_detail" cols="30" rows="10"></textarea> </p>
</form>
Copier après la connexion

3. Ajoutez le script à la fin du code HTML pour configurer la valeur initiale de la zone de texte, où PUBLIC est le chemin que j'ai configuré dans la configuration


<script type="text/javascript" src="__PUBLIC__/ueditor/ueditor.config.js"></script>
<script type="text/javascript" src="__PUBLIC__/ueditor/ueditor.all.min.js"></script>
<!--建议手动加在语言,避免在ie下有时因为加载语言失败导致编辑器加载失败-->
<!--这里加载的语言文件会覆盖你在配置项目里添加的语言类型,比如你在配置项目里配置的是英文,这里加载的中文,那最后就是中文-->
<script type="text/javascript" src="__PUBLIC__/ueditor/lang/zh-cn/zh-cn.js"></script>
<script type="text/javascript">
  UE.getEditor(&#39;intro_detail&#39;,{  //intro_detail为要编辑的textarea的id
    initialFrameWidth: 418,  //初始化宽度
    initialFrameHeight: 500,  //初始化高度
  });

</script>
Copier après la connexion

4. Habituellement, lorsque nous ajoutons un bouton à un formulaire, toutes les données du formulaire seront soumises par défaut. Cependant, mon projet implique également le téléchargement d'images ici, donc voici le problème. valeur à soumettre via la valeur de ("#intro_detail").val() dans jq ? La réponse est non. Ma solution est d'ajouter une entrée cachée sous la zone de texte, que j'utilise. La méthode fournie par ueditor obtient la valeur à l'intérieur. et l'attribue à l'entrée, afin qu'il puisse être soumis avec le formulaire. Dans le contrôleur, vous pouvez passer _POST('name of the form'), comme suit :


 <p >  
<textarea name="intro_detail" id="intro_detail" cols="30" rows="10"></textarea>
</p>
 <input type="text" style="display: none" id="intro_detail1" name="intro_detail1" >
Copier après la connexion

soumission ajax,

Copier le code Le code est le suivant :

$("#intro_detail1").val("' " +UE.getEditor('intro_detail').getContent()+"'");

Mettez l'entrée étiquetée dans la zone de texte avec des guillemets simples, enregistrez-la dans l'entrée et envoyez-la au en même temps. Quant à savoir pourquoi utilisez des guillemets simples, sinon ils ne seront pas envoyés et les balises seront automatiquement filtrées. Il nous suffit de supprimer les guillemets simples lorsque nous obtenons les données.


$.ajax({
          type: "POST",
          url: "<{:U(&#39;Admin/GameManager/Game/modGame&#39;)}>",
          dataType: &#39;json&#39;,
          processData: false,
          contentType: false,
          cache: false,
          data: formData,
          success:function(r){
            if(r.success){
              alert(&#39;编辑成功&#39;);
              window.location.reload();//重新刷新一次
              $(&#39;#user_dialog&#39;).modal(&#39;hide&#39;);
            }
            else{
              alert("参数错误");
            }
          }
        });
Copier après la connexion

5. Dans le contrôleur, vous pouvez utiliser $_POST (« nom du formulaire ») pour récupérer les données et les écrire dans la base de données


$db = M(&#39;game&#39;);
    $data  = $db->create(I(&#39;post.&#39;));
    $data[&#39;intro_detail&#39;] = $_POST[&#39;intro_detail1&#39;];
    $db->add($data);
Copier après la connexion

6. Lorsque nous obtenons les données dans la vue, il nous suffit de supprimer les guillemets simples


foreach($result as $key =>$value){    
      $result[$key][&#39;intro_detail&#39;]=str_replace("&#39;","",$result[$key][&#39;intro_detail&#39;]);//过滤单引号
    }
    $this->assign(&#39;game_list&#39;, $result);
    $this->display(&#39;&#39;);
Copier après la connexion

$result c'est moi Le contenu de la base de données est trouvé à l'aide d'instructions SQL, et intro_detail est le contenu du texte avec des étiquettes et des guillemets simples stockés dans la base de données


$user = M(&#39;game&#39;);
    $result = $user->field();
Copier après la connexion

7. Ce n'est en fait pas difficile, je fais de même, je vais vous donner quelques idées et vous pourrez en discuter davantage, je suis également novice.

Recommandations associées :

Comment intégrer tp3 dans l'éditeur Baidu ?

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn

Outils d'IA chauds

Undresser.AI Undress

Undresser.AI Undress

Application basée sur l'IA pour créer des photos de nu réalistes

AI Clothes Remover

AI Clothes Remover

Outil d'IA en ligne pour supprimer les vêtements des photos.

Undress AI Tool

Undress AI Tool

Images de déshabillage gratuites

Clothoff.io

Clothoff.io

Dissolvant de vêtements AI

Video Face Swap

Video Face Swap

Échangez les visages dans n'importe quelle vidéo sans effort grâce à notre outil d'échange de visage AI entièrement gratuit !

Outils chauds

Bloc-notes++7.3.1

Bloc-notes++7.3.1

Éditeur de code facile à utiliser et gratuit

SublimeText3 version chinoise

SublimeText3 version chinoise

Version chinoise, très simple à utiliser

Envoyer Studio 13.0.1

Envoyer Studio 13.0.1

Puissant environnement de développement intégré PHP

Dreamweaver CS6

Dreamweaver CS6

Outils de développement Web visuel

SublimeText3 version Mac

SublimeText3 version Mac

Logiciel d'édition de code au niveau de Dieu (SublimeText3)

Comment réparer les noms de fichiers ou les extensions trop longs dans Windows 11 ? Comment réparer les noms de fichiers ou les extensions trop longs dans Windows 11 ? Apr 22, 2023 pm 04:37 PM

Avez-vous déjà rencontré des problèmes lors du transfert de fichiers qui vous ont empêché de le faire ? Eh bien, de nombreux utilisateurs de Windows ont récemment signalé avoir rencontré des problèmes lors du copier-coller de fichiers dans un dossier, où une erreur était générée indiquant « Le nom de fichier du dossier de destination est trop long ». De plus, d'autres utilisateurs de Windows ont exprimé leur frustration lors de l'ouverture d'un fichier et ont déclaré que « le nom ou l'extension du fichier est trop long » et qu'ils n'ont pas pu ouvrir le fichier. Cela déçoit les utilisateurs en ne leur permettant pas de transférer des fichiers vers un autre dossier. En analysant le problème, nous avons proposé une série de solutions qui peuvent contribuer à atténuer le problème et permettre aux utilisateurs de transférer facilement des fichiers. Si vous êtes dans une situation similaire, veuillez consulter cet article pour plus d'informations. Source : https

Comment désactiver Windows Defender Smart Screen sous Windows 11, 10 ? Comment désactiver Windows Defender Smart Screen sous Windows 11, 10 ? Apr 26, 2023 am 11:46 AM

De nombreux utilisateurs de Windows ont récemment signalé qu'ils étaient ennuyés lorsque Windows Defender SmartScreen avertissait les utilisateurs de ne pas lancer d'applications qui n'étaient pas reconnues par Microsoft Windows et qu'ils devaient cliquer à chaque fois sur l'option "Exécuter quand même". Les utilisateurs de Windows ne savent pas ce qu'ils peuvent faire actuellement pour l'éviter ou le désactiver. Après avoir étudié le problème, nous avons constaté que la fonctionnalité Windows Defender sur le système peut être désactivée via l'application Paramètres ou l'éditeur de stratégie de groupe local ou en ajustant les fichiers de registre. En faisant cela, les utilisateurs n'auront plus à faire face au défenseur SmartScreen. Si votre système rencontre également

Guide détaillé de 15 éditeurs/IDE Python, il y en a toujours un qui vous convient ! Guide détaillé de 15 éditeurs/IDE Python, il y en a toujours un qui vous convient ! Aug 09, 2023 pm 05:44 PM

Il n'y a pas de meilleure façon d'écrire du code Python que d'utiliser un environnement de développement intégré (IDE). Non seulement ils peuvent rendre votre travail plus simple et plus logique, mais ils peuvent également améliorer l’expérience et l’efficacité de la programmation. Tout le monde le sait. La question est de savoir comment choisir le meilleur environnement de développement Python parmi les nombreuses options.

Logiciel essentiel pour la programmation en langage C : cinq bons assistants recommandés pour les débutants Logiciel essentiel pour la programmation en langage C : cinq bons assistants recommandés pour les débutants Feb 20, 2024 pm 08:18 PM

Le langage C est un langage de programmation basique et important. Pour les débutants, il est très important de choisir un logiciel de programmation approprié. Il existe de nombreuses options de logiciels de programmation C sur le marché, mais pour les débutants, il peut être un peu déroutant de choisir celui qui vous convient le mieux. Cet article recommandera cinq logiciels de programmation en langage C aux débutants pour les aider à démarrer rapidement et à améliorer leurs compétences en programmation. Dev-C++Dev-C++ est un environnement de développement intégré (IDE) gratuit et open source, particulièrement adapté aux débutants. Il est simple et facile à utiliser, intégrant un éditeur,

Correction d'un problème où les options de connexion de Windows 11/10 sont désactivées Correction d'un problème où les options de connexion de Windows 11/10 sont désactivées May 07, 2023 pm 01:10 PM

De nombreux utilisateurs Windows ont rencontré le problème de l'impossibilité de se connecter aux systèmes Windows 11/10 en raison de tentatives de connexion infructueuses ou de plusieurs arrêts du système. Les utilisateurs sont frustrés car ils ne peuvent rien y faire. Les utilisateurs peuvent oublier leur code PIN pour se connecter au système, ou rencontrer des retards lors de l'utilisation ou de l'installation de logiciels, et le système peut être obligé de s'arrêter plusieurs fois. Par conséquent, nous avons dressé une liste des meilleures solutions disponibles qui aideront sans aucun doute les consommateurs à résoudre ce problème. Pour en savoir plus, continuez à lire cet article. Remarque : Avant de faire cela, assurez-vous de disposer des informations d'identification de l'administrateur de votre système et du mot de passe du compte Microsoft pour réinitialiser votre code PIN. Sinon, attendez environ une heure et essayez avec le bon code PIN

Introduction aux outils de développement du langage Go : une liste d'outils essentiels Introduction aux outils de développement du langage Go : une liste d'outils essentiels Mar 29, 2024 pm 01:06 PM

Titre : Introduction aux outils de développement du langage Go : Liste des outils essentiels Dans le processus de développement du langage Go, l'utilisation d'outils de développement appropriés peut améliorer l'efficacité du développement et la qualité du code. Cet article présentera plusieurs outils essentiels couramment utilisés dans le développement du langage Go et joindra des exemples de code spécifiques pour permettre aux lecteurs de comprendre leur utilisation et leurs fonctions de manière plus intuitive. 1.VisualStudioCodeVisualStudioCode est un outil de développement multiplateforme léger et puissant doté de plug-ins et de fonctions riches.

Comment utiliser ClipChamp : l'éditeur vidéo gratuit de Windows 11 Comment utiliser ClipChamp : l'éditeur vidéo gratuit de Windows 11 Apr 20, 2023 am 11:55 AM

Vous vous souvenez de Windows MovieMaker sur Windows 7 ? Depuis l'arrêt de Windows MovieMaker, Microsoft n'a lancé aucun véritable créateur de films. D'un autre côté, ils ont essayé de réorganiser l'application Photos avec un éditeur vidéo intégré petit et léger. Après une longue période, Microsoft a lancé Clipchamp, un meilleur processeur vidéo pour tous les appareils Windows 11. Dans cet article, nous allons examiner en profondeur comment tout obtenir de l'application Clipchamp sur votre appareil Windows 11. Comment utiliser Clipchamp – Des tutoriels détaillés sont disponibles

Dix IDE et éditeurs de code Python fortement recommandés ! Dix IDE et éditeurs de code Python fortement recommandés ! Apr 19, 2023 pm 07:04 PM

Python est un langage de programmation puissant et très facile à apprendre. Python comprend des structures de données efficaces de haut niveau, offrant une programmation orientée objet simple et efficace. Le processus d'apprentissage de Python est indispensable sans IDE ou éditeur de code, ni éditeur de développement intégré (IDE). Ces outils de développement Python aident les développeurs à accélérer le développement à l'aide de Python et à améliorer l'efficacité. Un éditeur de code ou IDE efficace doit fournir des plug-ins, des outils et d'autres fonctionnalités qui peuvent aider les développeurs à développer efficacement. 1.VimVim peut être considéré comme le meilleur IDE pour Python. Vim est un éditeur de texte avancé conçu pour fournir la fonctionnalité « Vi » de l'éditeur Unix actuel et prendre en charge des fonctionnalités de plus en plus complètes.

See all articles