1

現在、自分のサイトに求人掲示板があり、ユーザーは求人のタイトルやキーワード、および求人を検索する場所を入力できます。

結果は、ページを更新せずにJquery/AJAXを使用して表示されます。ただし、特定の検索結果にリンクできるようにしたいと思います。たとえば、OHでWeb開発のポジションを検索する場合、リンクをクリックして、結果が既にロードされているページに直接移動できる他の誰かにリンクを送信できるようにしたいと思います。

私はPHPについてある程度の知識を持っていますが、AjaxやJavascript / Jqueryについては何も知りません。そのため、これは私にとって非常に難しいことです。誰かがこれを手伝ってくれることを願っています。

現在結果を表示しているコードは次のとおりです。

  jQuery(document).ready(function ($) {
      // search button clicked
      jQuery("input[name='indeedsearchbutton']").click(function () {
          indeedsearchbusy();
          indeedsearchcall();
      })

      // reset page if query changes
      jQuery("input[name='q']").change(function () {
          jQuery("input[name='start']").val(1);
      })

      // reset page if location changes
      jQuery("input[name='l']").change(function () {
          jQuery("input[name='start']").val(1);
      })

      if (autosearch) {
          indeedsearchbusy();
          indeedsearchcall();
      }
  })

  // pagination set start position
  function setstart(s) {
      jQuery("input[name='start']").val(s);
      indeedsearchbusy();
      indeedsearchcall();
  }

  // get json data from inputs for ajax call
  function getdata() {
      var d = {
          action: 'indeedcallback',
          q: (jQuery("input[name='q']").length != 0 ? jQuery("input[name='q']").val() : jQuery("select[name='q']").val()),
          l: jQuery("input[name='l']").val(),
          start: jQuery("input[name='start']").val()
      }
      return d;
  }

  // display json results from ajax call
  function indeeddisplayresults(resultsjson) {
      var rpage = "";
      if (resultsjson.pagination) rpage += resultsjson.pagination;

      if (resultsjson.html) rpage += resultsjson.html;

      if (resultsjson.pagination) rpage += resultsjson.pagination;

      jQuery("div#indeedsearchresults").html(rpage);
  }

  // ajax call to search indeed
  function indeedsearchcall() {
      var data = getdata();
      jQuery.post(wpajaxurl, data, function (response) {
          resultjson = eval("(" + response + ")");
          if (resultjson) {
              indeeddisplayresults(resultjson);
          }
      })
  }
4

1 に答える 1

0

URL とある種のハッシュバング (GETish) 機能を使用するだけです。そのため、誰かが検索を行うたびに URL が変更され、ページが読み込まれるたびに、検索パラメーターの URL が調べられ、存在する場合は検索が実行されます...

これには、以下のコードの完全な説明を含む素晴らしい GIST があります: https://gist.github.com/miohtama/1570295

function parseHashBangArgs(aURL) {

aURL = aURL || window.location.href;

var vars = {};
var hashes = aURL.slice(aURL.indexOf('#') + 1).split('&');

for(var i = 0; i < hashes.length; i++) {
   var hash = hashes[i].split('=');

   if(hash.length > 1) {
       vars[hash[0]] = hash[1];
   } else {
      vars[hash[0]] = null;
   }      
}

return vars;

}

これをどのように使用するかについてのあなたの質問を参照してOK：私は実際の例を作成しました（以下のコード）が、独自のコードで実装する必要があります（文字通りすべてを行うことはできません）...

<input id="searchBar" type="text" value="enter search here" /><br />
<input id="theButton" type="button" name="" value="getHash" /><br />
Hash value is: <a id="hashValue"></a>

jQuery(document).ready(function ($) {
    $('#searchBar').change(function() {
        search(document.getElementById('searchBar').value)
    });
    $('#theButton').click(function() {
        getHash();
    });
})
function search(searchTerms){
    location.hash = "searchTerm="+searchTerms;   
}

function getHash(){
    var hashObj= new Object(); 
    hashObj=(parseHashBangArgs())
    document.getElementById('hashValue').innerHTML=hashObj.searchTerm;
}

function parseHashBangArgs(aURL) {
... code from GIST above...
于 2013-03-20T00:19:30.943 に答える