2015-10-17 78 views
1

我有這樣的代碼來顯示從DB一些HTML代碼:打印成html與jQuery和PHP

$("#menuOverlay").append('<?php include('aggiungiPaginaComp.php');?>'); 

它的工作,從瀏覽器的源文件:

$("#menuOverlay").append('<form id="aggiungiPagina" 
name="aggiungiPagina" 
action="script/aggiungiPagina.php" 
method="post"> 

<tablestyle="width:100%;"> 
    <tr> 
     <td>NomePagina</td> 
     <td><inputsize="30" 
      maxlength="30" 
      placeholder="Inseriscinomepagina" 
      autofocus 
      required 
      type="text" 
      name="nomePagina" 
      id="nomePagina"></td> 
    </tr> 
    <tr> 
     <td>Descrizione</td> 
     <td><inputsize="50" 
      maxlength="200" 
      placeholder="Inseriscidescrizione" 
      required 
      type="text" 
      name="descrizione" 
      id="descrizione"></td> 
    </tr> 

</table> 
<divid="scrisciaBtnForm"> 
    <inputclass="btnMenu"type="submit"value="invia"/> 
</div> 
</form>'); 

但在div# menuOverlay空白..與:

$("#menuOverlay").append('<Button> ciao </Button>'); 

作品,爲什麼? 對不起英文不好。

+0

你爲什麼要追加這樣的內容,而不是用PHP渲染它? – PeeHaa

+0

因爲div的內容會改變 –

+1

我可以在第一行看到的一件事是,你在單引號內使用單引號。您需要轉義這些內容或在單引號內使用雙引號。 –

回答

0

有一次,你有很多無效的HTML,比如<tablestyle="width:100%;"> - 我猜想你在標記中損失了很多空間(可能是因爲RegEx?),這會破壞你試圖插入的HTML。

而且你不能只在JS中有多行字符串。你需要在每一個換行符要麼追加\或更換\n使它成爲一個字符串連接:

$("#menuOverlay").append('<form id="aggiungiPagina" '+ 
'name="aggiungiPagina" '+ 
'action="script/aggiungiPagina.php" '+ 
'method="post"> '+ 
' '+ 
'<table style="width:100%;"> '+ 
' <tr> '+ 
'  <td>NomePagina</td> '+ 
'  <td><input size="30" '+ 
'   maxlength="30" '+ 
'   placeholder="Inseriscinomepagina" '+ 
'   autofocus '+ 
'   required '+ 
'   type="text" '+ 
'   name="nomePagina" '+ 
'   id="nomePagina"></td> '+ 
' </tr> '+ 
' <tr> '+ 
'  <td>Descrizione</td> '+ 
'  <td><input size="50" '+ 
'   maxlength="200" '+ 
'   placeholder="Inseriscidescrizione" '+ 
'   required '+ 
'   type="text" '+ 
'   name="descrizione" '+ 
'   id="descrizione"></td> '+ 
' </tr> '+ 
' '+ 
'</table> '+ 
'<div id="scrisciaBtnForm"> '+ 
' <input class="btnMenu" type="submit" value="invia"/> '+ 
'</div> '+ 
'</form>'); 

在這裏看到:https://jsbin.com/vidajohevi/edit?html,js,output

0

你應該HTML編碼的頁面在PHP(讓你的雙引號慣於原因錯誤),然後html在JS中解碼。如果您使用jQuery這應該工作:

String.prototype.htmlDecode = function(){ 
 
    return $('<div/>').html(this).text(); 
 
}; 
 

 
$("#menuOverlay").append("<?php 
 
    ob_start(); 
 
    include('aggiungiPaginaComp.php'); 
 
    $page = ob_get_clean(); 
 
    echo htmlentities($page); 
 
?>".htmlDecode());

0

此:

<tablestyle="width:100%;"> 

應該是:

<table style="width:100%;"> 

同樣,這樣的:

<divid="scrisciaBtnForm"> 

應該是:

<div id="scrisciaBtnForm"> 

最後,刪除aggiungiPaginaComp.php所有新生產線。以這種方式使用Javascript時,Javascript會遇到新行的問題。