Question

我正在尝试插入图层的下拉列表，以使用Openlayers工具显示在wordpress中的地图中选择的图层。但是当我试图从drpdown列表中选择时，我得到了这个错误：

Uncaught ReferenceError: update is not defined
    at HTMLSelectElement.onchange ((index):226)

我的剧本：

var geojsonFormat = new ol.format.GeoJSON();

var vectorSource = new ol.source.Vector({
  loader: function(extent, resolution, projection) {
    var url = "http://localhost:8080/geoserver/opengeo/ows?service=WFS&" +
        "version=2.0.0&request=GetFeature&typename=opengeo:arbousiers0&CQL_FILTER=code_espec='Arteherb'"+
        "&outputFormat=text/javascript&format_options=callback:loadFeatures"+
        "&srsname=EPSG:3857";

    $.ajax({url: url, dataType: 'jsonp', jsonp: false});
  },
  strategy: ol.loadingstrategy.tile(ol.tilegrid.createXYZ({
    maxZoom: 19

  }))

});
window.loadFeatures = function(response) {
  vectorSource.addFeatures(geojsonFormat.readFeatures(response));
};

function update() {
  vectorSource.clear(true);
};

    function getRandomColor() {
        var letters = '0123456789ABCDEF';
        var color = '#';
        for (var i = 0; i < 6; i++ ) {
            color += letters[Math.floor(Math.random() * 16)];
        }
        return color;
    }

var map = new ol.Map({
  layers: [
  new ol.layer.Vector({
  source: vectorSource,
  style: new ol.style.Style({
    stroke: new ol.style.Stroke({
      color: 'rgba(0, 0, 255, 0.0)',
      width: 0.3
    }),
     fill : new ol.style.Fill({
   color: getRandomColor()
  })
  })
})
  ],
  target: document.getElementById('mapid'),
  view: new ol.View({
    center: [-1095791.453557, 3422374.879112],
    maxZoom: 19,
    zoom: 5
  })
});

我的下拉列表代码：

<select class='Nom' name="pam" id="pam" onchange="update()">
<option value="">--- Select Layer ---</option>
[insert_php]
$conn_string = "host=localhost port=5432 dbname=postgres user=postgres password=";
$conn = pg_connect($conn_string);


 $sql = pg_query($conn, "SELECT * FROM especes");

while($ligne_liste=pg_fetch_array($sql)) {
    echo '<option value="'.$ligne_liste['nom'].'">'.$ligne_liste['nom']."</option>\n";
}
echo '</select>';
[/insert_php]

然后我按照这里的答案调用functions.php中的onchage事件： https://wordpress.stackexchange.com/questions/248026/add-onchange-to-select-in-a-wp-form

function addAttributeToDropdown($html_content){
  $html_content = str_replace('<select','<select onchange="update()"',$html_content);
  return $html_content; 
}

add_filter('wp_dropdown_cats','addAttributeToDropdown');

Answer 1

wordpress可能会将脚本作为IIFE运行。因此，将事件处理程序附加到窗口对象

// private final String LOGCAT_CMD = "logcat :V *:S";
// private final String LOGCAT_CMD = "logcat | grep ";
// private final String LOGCAT_CMD = "logcat :I com.*****.filterlogcat:V *:S";

未捕获的ReferenceError：未定义onchange函数（wordpress）

1 个答案: