Maison > développement back-end > tutoriel php > Comment intégrer tp3 dans l'éditeur Baidu ?

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

零下一度
Libérer: 2023-03-14 08:00:02
original
2440 Les gens l'ont consulté

Partagez comment charger l'éditeur Baidu ueditor et le configurer
C'est en fait très simple, mais lors de la lecture de données, vous devez utiliser la fonction htmlspecialchars_decode($str); il sera lu Il y a un léger problème avec le contenu, veuillez consulter les détails

En raison des exigences de composition, nous devons souvent intégrer un éditeur de texte enrichi et afficher le contenu du texte avec la balise 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,

1. Nous allons d'abord ici www.jb51.net/codes/56667.html pour télécharger la version PHP version utf.

Mettez-le dans l'annuaire 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,

Le code est le suivant :

$("#intro_detail1").val("&#39;"+UE.getEditor(&#39;intro_detail&#39;).getContent()+"&#39;");
Copier après la connexion

Rassemblez l'entrée étiquetée dans la zone de texte avec des guillemets simples, et save Envoyez-le ensemble à l'entrée. Quant à savoir pourquoi les guillemets simples sont utilisés, sinon ils ne seront pas envoyés et les balises seront automatiquement filtrées Nous pouvons simplement traiter les guillemets simples lors de la sortie des 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, nous pouvons simplement 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 est le contenu de la base de données que j'ai 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 donne aussi quelques idées à tout le monde, vous pouvez en discuter davantage, je suis aussi novice.

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!

Étiquettes associées:
source:php.cn
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
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal