2013-08-22 41 views
-1

我需要幫助。 當我從create_table.php文件中拋出javascript代碼,並將其添加到script.js文件中時,將無法刪除表中的行。 如何區分這個文件?,有人可以幫我做這個工作嗎?怎麼了? Thx。如何分隔js,html和php文件

index_table.html

<html xmlns='http://www.w3.org/1999/xhtml' xml:lang='en'> 
<head> 
<title>Table</title> 
<script src="http://code.jquery.com/jquery-1.9.1.js"></script> 
<script src="script.js"></script> 
</head> 
<body> 
<div id="write_table"></div><br /><br /> 
</body> 
</html> 

的script.js

$(document).ready(function(){ 
    $.ajax({ 
     url:"create_table.php", 
     cache: false, 
     success: function(data){ 
      $("#write_table").html(data); 
    }}); 
}); 

create_table.php

<script type='text/javascript'> 
$(document).ready(function(){ 
    $('button.delete').click(function(e){ 
    var parent = $(this).closest('tr'); 
    $.ajax({ 
     cache: false, 
     data: parent, 
     success: function(){ 
     parent.fadeOut('fast', function(){ 
     parent.remove(); 
     }); 
    } 
});     
}); 
}); 
</script> 
<?php 
ini_set('display_errors', true); 
error_reporting(E_ALL + E_NOTICE); 
$tabela = new Tabela(); 
$header; 
$data= array (  
     array ("row_1", "row_1", "row_1", null),  
     array ("row_2", "row_2", "row_2", "row_2"), 
     array ("row_3", "row_3", "row_3", "row_3"), 
     array ("row_4", "row_4", "row_4", "row_4") 
); 
$header = array("col_1","col_2","col_3","col_4"); 
$tablica1 = $tabela->NapraviTabelu($header, $data, true, true, true); 
echo $tablica1; 
class Tabela { 
    function __construct() { 
    } 
public function NapraviTabelu($header, $data, $add=true, $edit=true, $delete=true){ 
$tablica1 = "<table border='3' id='tablicaId'><thead><tr>";  
    foreach ($header as $head){   
    $tablica1 = $tablica1."<th width='120px'>$head</th>"; 
    } 
if($edit || $delete){ 
    $tablica1 .= "<th height='44px'>/*******/</th>"; 
} 
$tablica1 .="</tr></thead>"; 
    if (isset($data)){   
    foreach($data as $row){ 
    $tablica1 .="<tr>"; 
    foreach($row as $column){ 
    if ($column !=''){ 
    $tablica1 .= "<td height='44px'>$column</td>"; 
    } 
    else {$tablica1 .="<td></td>";} 
    }           
if($edit || $delete)     
$tablica1 .= "<td align='right'>"; 
if($edit){$tablica1 .= "<button title='Edit' type='submit'><img src='Update.png'/> </button>";} 
if($delete){$tablica1 .= "<button name='cmdEdit' class='delete' title='Delete' type='submit'><img src='Remove.png'/></button>";} 
$tablica1 .= "</td></tr>"; 
} 
return $tablica1 ."</table>";   
} 
} 

} 
?> 
+0

應該正常工作,您的控制檯是否顯示任何錯誤? – tymeJV

回答

2

由於create_table.php通過ajax加載,其內的元件不會在存在DOM準備就緒。您將需要在ajax調用完成後執行此代碼,或者使用如下的事件委派。

代替$('button.delete').click(function(e){做到以下幾點:

​​

您可以在on documentation閱讀更多有關事件的代表團。

+0

就是這樣。非常非常感謝你! – Luka