Javascript 在动态生成的href标记中使用jQuery对话框

因此，我有一个动态生成的表，表的最后一行是一个href，其中包含数据库中每个人的唯一ID，它位于一个超链接下，这样我可以收集该人的ID，将其转移到另一个页面，并查看与特定ID关联的人的详细信息。href指向admin_edit.php，这是超链接将唯一ID指向的页面。现在，在当前状态下，单击超链接后，它将实际转到页面。但是我希望页面显示在jQuery对话框中。我以前也做过这种事，不过是用纽扣做的。由于某些原因，我无法以超链接的形式实现这一点

我的HTML/PHP/AngularJS代码： `

如何让超链接在对话框中的admin_edit.php中打开，而不是转到物理URL？

以下是一个示例

$function{ $a.ClickFunction{ //防止违约 e、 防止违约； //抓取url并用它做你想做的事 提醒$this.attrref； //获取自定义属性 警报$this.dataid； }; };

---

因为您使用的是angular，所以使用ng click而不是jQuery onClick。然后可以将data.id传递给$scope中的函数

---

你给自己一个ID，然后在php页面上调用ID.load on click事件，传递类似于dlg.load'admin/admin_edit.php？ID='+ID的内容。你能提供代码解决方案吗？不，这不是它的目的。但我为您提供了一条路径，通过一些研究工作，它可以引导您找到所需的代码：当然，其他人有时会忽略这一点，并给出问题的完整代码答案，但这是另一个主题。啊，好吧，只要你不感到不耐烦，问题是对话框甚至不会打开。我不明白为什么，因为在同一页上，我有相同的设置，但对话框链接到按钮，并且它以这种方式完美地工作。我对超链接应用了类似的结构，但对话框甚至无法打开。我不知道我做错了什么/尝试了一下，但它没有打开任何对话框，甚至没有重定向到admin_edit.phpDid。你把$scope.showDialog方法放在一个控制器中了吗？我复制了AngularJS代码，我对AngularJS非常陌生，所以我不太确定控制器是什么。你的列表是如何填充数据的？它必须在某种控制器中才能在您的页面上访问。

<div>
       <table>
               <tbody>                 
                <tr ng-repeat="data in filtered = (list | filter:search | orderBy : predicate :reverse) | startFrom:(currentPage-1)*entryLimit | limitTo:entryLimit">
                    <td>{{data.first_name}} {{data.last_name}}</td>
                    <td>{{data.team_name}}</td>
                    <td>{{data.role}}</td>
                    <td>{{data.phone}}</td>
                    <td>{{data.to_date}}</td>
                    <td>{{data.email}}</td>
                    <td><a id="modifyLink" href="admin/admin_edit.php?id={{data.id}}">{{data.id}}</a></td>   
                </tr>
                </tbody>
            </table>        
        </div>

        <div class="col-md-12" ng-show="filteredItems == 0">
            <div class="col-md-12">
                <h4>No data found</h4>
            </div>
        </div>
        <div class="col-md-12" ng-show="filteredItems > 0">    
            <div pagination="" page="currentPage" on-select-page="setPage(page)" boundary-links="true" total-items="filteredItems" items-per-page="entryLimit" class="pagination-small" previous-text="&laquo;" next-text="&raquo;"></div>
        </div>
    </div>
    <div id="modify" class="divider"></div> `

$(document).ready(function() { 
         var dlg=$('#modify').dialog({
           title: 'Modify',
           resizable: true,
           autoOpen:false,
           modal: true,
           hide: 'fade',
           width:600,
           height:500
         });


         $('#modifyLink').click(function(e) {
           dlg.load('admin/admin_edit.php');
           e.preventDefault();
           dlg.dialog('open');
        }); 
}); 

<a href ng-click="showDialog(data.id);" id="modifyLink">{{data.id}}</a>

$scope.showDialog = function(id) {
    var dlg=$('#modify').dialog({
        title: 'Modify',
        resizable: true,
        autoOpen:false,
        modal: true,
        hide: 'fade',
        width:600,
        height:500
    });
    dlg.load('admin/admin_edit.php?id='+id);
    dlg.dialog('open');
};