链接到页面内的框

Tameem M Melhem 发表于 Dev

Tameem M梅勒姆

我通常在某些站点中看到垂直导航菜单，并且这些链接应用于页面中的框，而不是<iframe>标签。谁能帮忙。谢谢你

玛杜桑卡（Isuru Madusanka）

我认为您尝试在不刷新页面的情况下告诉加载div。我们称其为单页应用程序，例如Gmail。您可以通过几种方法完成此操作。

通过调用ajex手动执行此操作，并从主机加载div。所有事件都由单独的JS函数处理。
尝试框架。

*诸如struct2的后端框架具有此功能，因此您必须在后端中编码此方法

*诸如angularjs之类的前端框架支持路由功能可以实现此结果。因此，这次您必须在前端处理JS。

Angular JS中的示例

var app = angular.module( "myApp", [] );

app.config( function ( $routeProvider ) {
  $routeProvider
    .when( '/this', { templateUrl: 'this.html' } )
    .when( '/that', { templateUrl: 'that.html' } )
    .when( '/other', { templateUrl: 'other.html' } )
    .otherwise( { redirectTo: '/this' } );
});

app.controller( 'MainCtrl', function ( $scope ) {
});

<script type="text/ng-template" id="this.html">
  This Page.
</script>
<script type="text/ng-template" id="that.html">
  That Page.
</script>
<script type="text/ng-template" id="other.html">
  Other Page.
</script>

<div ng-controller="MainCtrl">
  <ul>
    <li><a href="#/this">This</a></li>
    <li><a href="#/that">That</a></li>
    <li><a href="#/other">Other</a></li>
  </ul>
  <ng-view></ng-view>
</div>