Question

我希望有人可以帮助我。

我正在使用PHP，AJAX，JQUERY和XML文件。

我想使用AJAX（不刷新页面）动态更新XML文件的查询字符串，并从数据库中获取新的XML文件和新结果......

我基本上已经完成了所有这些工作，但不确定如何更新XML文件的参数。

所以基本上我想要一个链接或一个按钮，或者下拉参数值

<button>Test1</button>
<button>Test2</button>
<button>Test3</button>

当我点击Button Test1时 - 它应该将XML文件（在JavaScript中）设置为page.php？q = test1 如果我单击Test2，它应该将page.php更改为page.php？q = test2

如何根据提交的按钮的值设置要更改的XML文件参数，如果我可以将参数更新为按钮的值我很好，并且可以进行刷新

XML页面确实是一个PHP页面，它根据传递给页面的查询字符串以XML格式生成结果。

如果我手动将查询字符串更改为page.php？q = test2我会根据查询字符串获得结果，我只需要点击

以下是我的代码示例（更新代码以显示确切示例）

    <script>
var customIcons = {
      events: {
        icon: '/wp-content/uploads/gmaps/icons/car.png',
      },
      bar: {
        icon: 'http://labs.google.com/ridefinder/images/mm_20_red.png',
        shadow: 'http://labs.google.com/ridefinder/images/mm_20_shadow.png'
      }
    };
google.maps.visualRefresh = true;
var panorama;
var entryPanoId = null;
function initialize() {
var xmap = new google.maps.LatLng(-26.245325,27.982386);
var mapDiv = document.getElementById('map-canvas');
  var map = new google.maps.Map(mapDiv, mapOptions);
  google.maps.event.addDomListener(mapDiv, 'click', showAlert);
  var mapOptions = {
    center: xmap,
    zoom: 10,
    mapTypeId: google.maps.MapTypeId.ROADMAP
  };
  var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
var infoWindow = new google.maps.InfoWindow;

  downloadUrl("/wp-content/themes/geraldferreira/templates/phpsqlsearch_genxml.php", 
  function(data) {
        var xml = data.responseXML;
        var markers = xml.documentElement.getElementsByTagName("marker");
        for (var i = 0; i < markers.length; i++) {
          var name = markers[i].getAttribute("name");
          var address = markers[i].getAttribute("address");
          var type = markers[i].getAttribute("type");
          var map_icon = markers[i].getAttribute("map_icon");
          var map_desc = markers[i].getAttribute("map_desc");
          var map_info_url = markers[i].getAttribute("map_info_url");
          var point = new google.maps.LatLng(
              parseFloat(markers[i].getAttribute("lat")),
              parseFloat(markers[i].getAttribute("lng")));
          var html = "<h2>" + name + "</h2>"+map_desc + "<br/><b>Address:</b> "+ address+"<br/>More about<br/><button onclick='location.href=\""+map_info_url+"\"' class='btn btn-mini btn-info'>"+ name +"</button> <button class='btn btn-mini btn-info' onclick='toggleStreetView(this);'>Virtual Tour</button>";
          var icon = customIcons[type] || {};
          var marker = new google.maps.Marker({
            map: map,
            position: point,
            icon: icon.icon,
            shadow: icon.shadow
          });
          bindInfoWindow(marker, map, infoWindow, html);
        }
      });


  panorama = map.getStreetView();
  var panoOptions = {
    position: xmap,
    visible: true,
    panoProvider:  getCustomPanorama
  };
  panorama.setOptions(panoOptions);
  var streetviewService = new google.maps.StreetViewService();
  var radius = 100;
  streetviewService.getPanoramaByLocation(xmap, radius,
      function(result, status) {
    if (status == google.maps.StreetViewStatus.OK) {
      google.maps.event.addListener(panorama, 'links_changed',
        function() {
          createCustomLinks(result.location.pano);
        });
    }
  });function bindInfoWindow(marker, map, infoWindow, html) {
      google.maps.event.addListener(marker, 'click', function() {
        infoWindow.setContent(html);
        infoWindow.open(map, marker);
      });
    }
    function downloadUrl(url, callback) {
      var request = window.ActiveXObject ?
          new ActiveXObject('Microsoft.XMLHTTP') :
          new XMLHttpRequest;

      request.onreadystatechange = function() {
        if (request.readyState == 4) {
          request.onreadystatechange = doNothing;
          callback(request, request.status);
        }
      };
      request.open('GET', url, true);
      request.send(null);
    }
    function doNothing() {}
}
function getCustomPanoramaTileUrl(pano, zoom, tileX, tileY) {
  return "/wp-content/uploads/virtual_tours/"+pano+'/images/'+tileX+'-'+tileY+'.png';
}
function getCustomPanorama(pano) {
  switch(pano) {
      <?php
global $wpdb;
$virtual_tours = $wpdb->get_results( "SELECT * FROM wp_virtual_tours" );
foreach($virtual_tours as $virtual_tour){
    echo "case '".$virtual_tour->id."': return {location: {pano: '".$virtual_tour->id."', description: '".$virtual_tour->virtual_tour_name." - ".$virtual_tour->id."', latLng: new google.maps.LatLng(-26.245325,27.982386)},links: [], copyright: 'Imagery (c) 2010 Google', tiles: {tileSize: new google.maps.Size(512, 512),worldSize: new google.maps.Size(4096, 2048),centerHeading: ".$virtual_tour->virtual_tour_centerheading.",getTileUrl: getCustomPanoramaTileUrl}}; break;";
}
?>
    default:
      return null;
  }
}
function createCustomLinks(entryPanoId) {
  var links = panorama.getLinks();
  var panoId = panorama.getPano();
  switch(panoId) {
      <?php if ($_GET[virtualtour] != Null)
         {
             echo "case entryPanoId: links.push({heading: 310, description : 'Johannesburg Boat Show 2013', pano : '".$_GET["virtualtour"]."'}); break;";
         }
         elseif ($_GET[virtualtour] == Null){
             echo "case entryPanoId: links.push({heading: 310, description : 'Johannesburg Boat Show 2013', pano : '90'}); break;";
             }
         ?>

    <?php
global $wpdb;
$virtual_tours = $wpdb->get_results( "SELECT * FROM wp_virtual_tours" );
foreach($virtual_tours as $virtual_tour){
    echo ''.$virtual_tour->virtual_tour_links_code.'';
}
?>
default:
    return;
  }
}
function toggleStreetView() {
  var toggle = panorama.getVisible();
  if (toggle == false) {
    panorama.setVisible(true);
  } else {
    panorama.setVisible(false);
  }
}
function showAlert() {
  /*window.alert('DIV clicked');*/
}
google.maps.event.addDomListener(window, 'load', initialize);
    </script>

这是XML（PHP FILE），我需要在上面的代码中添加参数

downloadUrl("/wp-content/themes/geraldferreira/templates/phpsqlsearch_genxml.php"

所以点击按钮我想将参数传递给phpsqlsearch_genxml.php?q=newvalue" 并通过Ajax刷新页面而不是重新加载页面

Answer 1

你基本上只是想改变一个参数...这样就可以这样做（例如）：

var sendData= "q=test1";

function doRequest(){
    $.ajax({
        url: 'page.php',
        type: 'get',
        dataType:'text/xml',
        data: sendData,
        success: function (data) {
        //do things
    });
}

function buttonOneClick(){
    sendData= "q=test1";
    doRequest();
}

function buttonTwoClick(){
    sendData= "q=test2";
    doRequest();
}

......或者在你的情况下

function downloadUrl(url, callback) {
  var request = window.ActiveXObject ?
      new ActiveXObject('Microsoft.XMLHTTP') :
      new XMLHttpRequest;

  url += "?"+sendData;

  request.onreadystatechange = function() {
    if (request.readyState == 4) {
      request.onreadystatechange = doNothing;
      callback(request, request.status);
    }
  };
  request.open('GET', url, true);
  request.send(null);
}

对于要查询的XML页面，JQuery在php中更改params或value

1 个答案: