如果由 php ajax 函数返回，href="#" 不起作用答案

【问题标题】：href="#" doesn't work if returned by php ajax function如果由 php ajax 函数返回，href="#" 不起作用
【发布时间】：2016-11-15 18:17:41
【问题描述】：

我有一个带有 div (id=reqs) 的 html 页面。我想在页面加载后加载 div 的 html 内容。所以我创建了一个 ajax 调用，它使用 php 从数据库中获取数据并将其“回显”到 html 代码中以填充到 div 中。

我的html：

<html>
<body>
<div class="content" id="reqs"></div>

            <script> $(document).ready(function() {
                $.ajax({
                     type: "GET",
                     url: '../getreqs',
                     success: function(data) {
                        $('#reqs').html($data);
                     }
                });             });         </script>

</body>
</html>

我的 php ajax 函数：

                $data .= "<div class=\"toggle store-history-toggle\">";
                $data .= "<a href='#' class=\"toggle-title\"><strong class=\"bg-yellow-dark\">" . "YP" . "</strong>" . "ER" . "<i class=\"fa fa-plus\"></i></a>";
                $data .= "<div class=\"toggle-content\">";
                $data .= "<div class=\"cart-costs\">";
                $data .= "<h4>Details</h4>";
                $data .= "<h5><strong>Name</strong><em>John Doe</em></h5>";
                $data .= "</div>";
                $data .= "</div>";
                echo $data;

我的问题是我的 href="#" （应该扩展显示其下方详细信息的 div）不起作用，但如果我复制从我的 php 生成的完全相同的 html 并将其粘贴到我的 html 中它可以工作完美。

更多信息： - 我的 html 代码在文件夹“htmlroot/子文件夹”中 - 我的 php 代码在文件夹“htmlroot”中

我的解决方法： - 我在herf="#" 和href='#' 之间切换 - 我有 php 代码给我href="LINKREF"，并在获取数据后用我的 ajax 函数将 LINKREF 替换为 #

var res = String(data).replace(/LINKREF/g, "#");

这些尝试都不起作用

【问题讨论】：

Related question
你能显示不使用php ajax的工作的sn-p吗？
不应该 $('#reqs').html($data); 是 $('#reqs').html(data); 而是在 .success() 下？

标签： javascript php html ajax

【解决方案1】：

href="#" 是指向页面顶部的链接。在任何情况下，它都不会扩展 div。

大概你有一些 JavaScript 会寻找链接并将自己绑定到它们，这样当你点击链接时，JS 会触发，然后 JS 会展开 div。

（注意：将那种 JS 绑定到页面顶部的链接是没有意义的。按钮元素会更合适）。

你需要找到 JS 并且：

改为使用delegated event handlers
在您在问题中添加的 JS 正在添加的新 DOM 元素上运行它

【讨论】：