Question

我有一个表单设置，在提交时，使用ajax调用通过PHP文件检索数据，而PHP文件又根据输入字段值从给定的URL中删除数据。

一切都很完美，但我现在要做的是实现一些额外的功能。

1）在初始表单提交后，我希望它以设定的时间间隔自动更新查询（由最终用户选择）。如果可能的话，我想将新结果附加到旧结果之上。

2）当返回新结果时，我希望在页面标题中发出通知以通知用户（Think Facebook及其通知提醒）。

当前的jQuery / Ajax代码：

form.on('submit', function(e) {
e.preventDefault(); // prevent default form submit

$.ajax({
  url: 'jobSearch.php', // form action url
  type: 'POST', // form submit method get/post
  dataType: 'html', // request type html/json/xml
  data: form.serialize(), // serialize form data 
  beforeSend: function() {
    alert.fadeOut();
    submit.val('Searching....'); // change submit button text
  },
  success: function(data) {
    $('#container').css('height','auto');
    alert.html(data).fadeIn(); // fade in response data
    submit.val('Search!'); // reset submit button text
  },
  error: function(e) {
    console.log(e)
  }
});

});

我不太确定我会怎么做，有人能给我一个见解吗？我不是在追问某人为我完成它，只是给我一些关于我应该使用什么方法的指导。

编辑 - jobSearch.php

<?php
error_reporting(E_ALL);
include_once("simple_html_dom.php");

$sq = $_POST['sq'];
$sq = str_replace(' ','-',$sq);


if(!empty($sq)){
//use curl to get html content
$url = 'http://www.peopleperhour.com/freelance-'.$sq.'-jobs?remote=GB&onsite=GB&filter=all&sort=latest';
}else{
$url = 'http://www.peopleperhour.com/freelance-jobs?remote=GB&onsite=GB&filter=all&sort=latest';
}

$html = file_get_html($url);
 $jobs = $html->find('div.job-list header aside',0);
echo $jobs . "<br/>";
foreach ($html->find('div.item-list div.item') as $div) {
 echo $div . '<br />';
};
?>

Answer 1

如果我理解正确的话。。

为了更新，你可以尝试这样做：

var refresh_rate = 2500

function refresh_data() {
    // - - - do some things here - - -
    setTimeout (refresh_data(),refresh_rate); // mb not really correct
}

你可以read more about it here

希望，我帮助了你

Answer 2

问题1：

您可以将当前的ajax代码包装在setInterval()中，这样您就可以继续轮询jobSearch.php结果。类似的东西：

function refreshPosts(interval) {
  return setInterval(pollData, interval); 
}

function pollData() {
  /* Place current AJAX code here */
}

var timer = refreshPosts(3000);

这样做还有一个好处，就是可以调用timer.clearInterval()来停止自动更新。

附加数据而不是替换数据比较棘手。老实说，最好的方法是重写你的屏幕抓取器以返回JSON对象而不是纯HTML。如果你要返回一个像这样的对象：

{
  "posts": [
  // Filled with strings of HTML
  ]
}

您现在拥有一个可以进行排序，过滤和编制索引的数组。这使您能够将一个帖子与另一个帖子进行比较，看它是旧的还是新的。

问题2：

如果你像我上面提到的那样改写了，那就像保留新帖数量并重写标题HTML一样容易

$('title').html(postCount + ' new job postings!');

希望有所帮助！

在初始表单提交后使用ajax / jQuery自动刷新，然后更改页面标题

2 个答案:

问题1：

问题2：