Heim  >  Artikel  >  Backend-Entwicklung  >  Beispiel für eine eingebettete Baidu-Editor-Ueditor-Methode in thinkphp3.2

Beispiel für eine eingebettete Baidu-Editor-Ueditor-Methode in thinkphp3.2

小云云
小云云Original
2018-02-07 10:28:151299Durchsuche

In diesem Artikel wird hauptsächlich der im Baidu-Editor eingebettete Beispielcode vorgestellt. Ich hoffe, er kann jedem helfen.

In diesem Artikel wird thinkphp3.2 zum Einbetten des Baidu-Editors ueditor vorgestellt. Teilen Sie ihn mit allen. Ich hoffe, dieser Artikel wird Ihnen hilfreich sein.

Aufgrund der Satzanforderungen gibt es viele Mal müssen wir einen Rich-Text-Editor einbetten und Textinhalte mit HTML-Tags ausgeben. Weil ich kürzlich an einem Backend-Managementsystem gearbeitet habe, das die Bearbeitung des Textinhalts erfordert, damit es Text mit HTML-Tags ausgeben und auf dem Server speichern kann. Der Client sendet eine Anfrage, um den getaggten Text vom Server abzurufen. Ich verwende ueditor,

und lege es in das öffentliche Verzeichnis.

2. Wenn wir den Rich-Text-Editor in der Ansicht verwenden, fügen wir normalerweise einen Textbereich zum Formular hinzu,


<form>  
<p><textarea name="intro_detail" id="intro_detail" cols="30" rows="10"></textarea> </p>
</form>

3. Fügen Sie das Skript am Ende des HTML-Codes hinzu, um den Anfangswert des Textfelds zu konfigurieren, wobei PUBLIC der Pfad ist, den ich in der Konfiguration konfiguriert habe


<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>

4. Wenn wir einem Formular eine Schaltfläche hinzufügen, werden normalerweise alle Daten im Formular übermittelt. Da ich hier jedoch auch die asynchrone Übermittlung von Bildern verwende, besteht das Problem Wert, der über den Wert von ("#intro_detail").val() in jq übermittelt werden soll? Die Antwort lautet: Nein. Meine Lösung besteht darin, eine versteckte Eingabe unter dem Textbereich hinzuzufügen, die ich verwende. Die von ueditor bereitgestellte Methode ruft den Wert ab und weist es der Eingabe zu, sodass es zusammen mit dem Formular übermittelt werden kann. Im Controller können Sie _POST('Name des Formulars') wie folgt übergeben:


 <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" >

Ajax-Übermittlung,

Code kopieren Der Code lautet wie folgt:

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

Fügen Sie die beschriftete Eingabe zusammen mit einfachen Anführungszeichen in das Textfeld ein, speichern Sie sie in der Eingabe und senden Sie sie an die Was den Grund betrifft, verwenden Sie einfache Anführungszeichen, da sie sonst nicht gesendet werden und die Tags automatisch herausgefiltert werden. Wir müssen nur die einfachen Anführungszeichen entfernen, wenn wir die Daten erhalten.


$.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("参数错误");
            }
          }
        });

5. Im Controller können Sie $_POST ('Name des Formulars') verwenden, um die Daten abzurufen und in die Datenbank zu schreiben


$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);

6. Wenn wir die Daten zur Ansicht erhalten, müssen wir nur die einfachen Anführungszeichen


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;);
$result is me Der Datenbankinhalt wird mithilfe von SQL-Anweisungen gefunden, und intro_detail ist der Textinhalt mit Beschriftungen und einfachen Anführungszeichen, der in der Datenbank gespeichert ist


$user = M(&#39;game&#39;);
    $result = $user->field();
7. Es ist eigentlich nicht schwierig, ich mache das Gleiche, ich werde Ihnen einige Ideen liefern und Sie können mehr besprechen. Ich bin auch ein Neuling.


Verwandte Empfehlungen:


Wie bette ich tp3 in den Baidu-Editor ueditor ein?

Das obige ist der detaillierte Inhalt vonBeispiel für eine eingebettete Baidu-Editor-Ueditor-Methode in thinkphp3.2. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn