框架替代链接不起作用

Question

我正在寻找HTML框架集的替代解决方案，从我到目前为止所读到的内容，我可以使用带有CSS的DIV来创建列内容。基本上，我希望我的图像在左侧的一列中，并且在单击时应该在右侧的列中调用details.php（标记为id = details）。

我从以下开始;不幸的是，单击左列中的链接并未调用右列中的任何内容：

<div class="col1">
            <a href="details.php?PersonID=<?php echo $PersonID; ?>" target=details> <?php echo $row['FamilyName']; ?> <?php echo $row['FirstName']; ?> </a>
        </div>


    <div class="col2" id="details">
        <?php   $file = file_get_contents('./details.php', true); ?> 
    </div>

我将不胜感激任何建议。

Answer 1

你可以结合HTML＆amp;使用jQuery或任何javascript库的CSS使用AJAX异步加载内容（details.php）。

$('a').on('click', function(e) { var contentUrl = $(this).attr('href'); $('#details').load(contentUrl, function() { console.log('the content has been loaded is appended into the div'); }); });

如需更多参考，请访问jQuery API - load。