1

我有一个页面single-colur.html，它可以采用各种设置的查询字符串，如下所示：

single-colur.html?id=1
single-colur.html?id=2
single-colur.html?id=3
single-colur.html?id=4

以上id引用了colour具有以下列的表：

id
name
content

当人们来single-colur.html请求一个特定的 ID 时，我想从 URL 中获取相应的 ID 并向 PHP 页面发送 AJAX 请求，该页面将根据提供的 ID 从我的表中获取相应的行，这个目前正在实施。

我的问题是：如果有人去，是否有可能根据ID 引用single-colur.html?id=1的字段获取所有数据并显示在新 URL 中，例如将您指向一个名为动态创建的文件，它显示来自这个 ID 的表？namesingle-colur.html?id=1red.htmlcolour

我的限制是我必须动态创建新文件，并且不能静态完成。

编辑

目前我有两页。

1)归档颜色.html

2）单色.html

在存档颜色.html 

<div>

 <a href="single-colour.html?id=1">Red</a>
 <a href="single-colour.html?id=2">Green</a>
 <a href="single-colour.html?id=3">Blue</a>

</div>

在single-color.html?id=anynumber 中

<div class="result">

</div>

在single-colur.html我正在做 ajax并使用请求的 id 从数据库中获取详细信息并显示在类结果中。

这是目前的流程。但我需要的是

在 single-color.html?id=anynumber 中

我必须用 colour-name.html 替换当前页面 url

并显示细节。[但问题是server 中没有 colour-name.html 页面。即服务器中没有red.html、green.html、blue.html。它必须由 jquery 虚拟创建。]

4

3 回答 3

1

使用阿贾克斯：

$.ajax({
  url: "my-colours.html",
  type: "get", //send it through get method
  data: { 
    id: //<Your id here >
  },
  success: function(response) {
    window.location.href = '/' + response.color + '.html' ;
  },
  error: function() {
    //Do Something to handle error
  }
});

我想这就是你要找的。这里将通过 ajax 创建一个动态链接，您可以每次给 Id 一个动态值。

于 2018-06-23T14:20:09.873 回答
0

此示例在此环境中已尽可能完整。

  • 通过ajax点击加载
  • 设置内容
  • 设置虚拟网址

$( 'a.virtual' ).click( function( e ) {
  var link = $(this);
  console.log( "Loading: " + link.attr('href') );
  $.ajax({
    url: link.attr('href'),
    type: "get",
    success: function(response) {
      // parse json or howerver data get transferred
      var result = parseJSON(response);
      var content = result['content'];
      var virtual_url = result['url'];

      // set content
      $('#content').html( content );

      // set virtual url
      window.history.pushState([], 'Title', virtual_url);
    }
  });
  
  // do not follow the link!
  e.preventDefault();
  return false;
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul>
  <li><a class="virtual" href="my-colours.html?id=1">Link A</a></li>
  <li><a class="virtual"  href="my-colours.html?id=2">Link B</a></li>
  <li><a class="virtual"  href="my-colours.html?id=3">Link C</a></li>
  <li><a class="virtual"  href="my-colours.html?id=4">Link D</a></li>
<ul>
<br/>
Content delivered via ajax:<br/>
<div id='content'>
</div>

于 2018-06-23T15:25:43.943 回答
0

所以你用

window.location = window.location.hostname + "here put the returned from ajax" + ".html";

解释

window.location.hostname

返回网站网址

于 2018-06-23T13:56:07.670 回答