Question

我正在为网站管理编辑菜单。当我打开#ausgabe时，编辑菜单应加载到div admin.php.($('#ausgabe').load('./admin-ajax/ajax2.php'))中，这样可行！

<!DOCTYPE html>
<html>
<head>
<title>admin.php</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<?PHP 
echo "<script type='text/javascript' src='http://" . $_SERVER['HTTP_HOST']. "/includes/jquery/jquery-2.1.3.min.js'></script>";

<script type="text/javascript">
    $(document).ready(function() {
            $('a').click(function(){
            var id = $(this).prop('id');
            var action = $(this).prop('name');
            var value = $(this).prop('value');
            $('#ausgabe').load('./admin-ajax/ajax2.php?id=' + id+'&action=' + action+'&value=' + value)  // http://entwickler-forum.de/showthread.php/73216-Tags-quot-laden-quot
        });
        $('#ausgabe').load('./admin-ajax/ajax2.php') // Grundgerüst für Editormenü mit den Artikeln der User
    });
</script>
echo "</head>";

// Testlink in admin.php -works-
    echo "<td class='aktivitaet'><a href='#' id='3333' name='del' value='0'>test 1</href></td>";

// Dynamic Content output through ajax2.php
    echo "<div id='ausgabe'> </div>";

该脚本还应该从数据库加载特定数据。 varables（id，name）来自link.That也有效！

 $('a').click(function(){
        var id = $(this).prop('id');
        var action = $(this).prop('name');
        var value = $(this).prop('value');
        $('#ausgabe').load('./admin-ajax/ajax2.php?id=' + id+'&action=' + action+'&value=' + value)  
    });

动态输出在ajax2.php中生成。（我缩短了脚本。因此只有一个Testlink。）而这个testlink“test 2”不起作用。我认为变量（id，name）不会进入ajax2.php。是不是？

<?PHP 
//ajax2.php
    echo "<td class='aktivitaet'><a href='#' id='77777' name='del' value='0'>test 2</href></td>";

   $id = $_GET["id"]; 
   $action = $_GET["action"]; 
   $value = $_GET["value"];

   switch ($action) {
        case ('del'):
        echo "Date should get deleted. ID: ".$id." - " .$action . " - " . $value . " <br>";
        include ($_SERVER['DOCUMENT_ROOT'] . '/admin/admin-ajax/case_del.inc.php');
        break;

    } 
?>

是否有任何解决方案可以在动态生成的内容中使用链接更新<div>？直到现在我一无所获。也许我走错了路？

Answer 1

我对您的问题感到困惑，但我认为问题在于您没有使用事件委托。您绑定到DOM中当前的a标记。当您加载新的HTML时，任何新的a代码都不会绑定click个处理程序。

尝试使用以下内容委派事件绑定：

$("body").on( "click", "a", function() {
   var id = $(this).prop('id');
   // ...
});

使用同一<div>中的动态内容更新<div> onclick

1 个答案: