0

首先是一点背景......我正在研究一个数据库项目,该项目通过网络表单从与博物馆标本相关的印刷标签中收集数据。表单的一部分包括几个 Locality 字段,例如国家、州、县和位置。通常,这些标本没有与之相关的地理坐标(纬度、经度),因此需要对它们进行追溯地理参考。我有一个图标作为表单的一部分,它链接到一个 Web 应用程序,如果给定上面列出的表单字段中的值,它将绘制一个点。

因此,如果可能的话,我想做的是让数据库人员在表单中输入位置数据。当他们填写位置字段时,javascript onblur 或 onchange 事件将构建一个查询字符串(即 ?country=xxx&state=xxx&county=xxx&location=xxx; 其中 xxx 是从 onblur 表单中获取的数据),以便可以将其附加到图标链接,以便访问地图 Web 应用程序。在某些情况下,样本可能没有所有位置字段的数据,这可能会使事情变得有点复杂(??),但地图应用程序就是为了处理这个问题而构建的。

示例输入字段:

    <input name="country" placeholder="Country" onblur="if(this.value != '') { SOME CODE HERE??;}" required="required" type="text"/>

图标+链接:

    <a href="http://www.museum.tulane.edu/geolocate/web/WebGeoref.aspx?country=xxx&state=xxx&county=xxx&locality=xxx" class="lytebox" data-title="Find Lat/Long" data-lyte-options="width:1000px height:800px scrollbars:no"><img title="Click to georeference location using GEOLocate." alt="" height="16" src="images/world.png" width="16" class="auto-style5"></a>

我对javascript不是很熟悉,我已经搜索了很多与这个问题类似的解决方案,但到目前为止我还是一无所获。

我希望有人能帮帮忙。

4

1 回答 1

0

好的,经过几个小时的修补,我想我想出了这个。

我想出的脚本放在标题中:

    <script type="text/javascript">
    function check_onblur() {
         var country = document.getElementById('country').value;
         var state = document.getElementById('state').value;
         var county = document.getElementById('county').value;
         var locality = document.getElementById('locality').value;

         document.getElementById('geolink').href = "http://www.museum.tulane.edu/geolocate/web/
           WebGeoref.aspx?country=" + country + "&state=" + state + "&county=" + county 
           + "&locality=" + locality;
    }
    </script>

表单上的示例输入字段:

    <input id="country" tabindex="14" name="country" placeholder="Country"
       onblur="check_onblur();" required="required" type="text"/>

根据表单字段条目更新的图像链接:

    <a id="geolink" href="http://www.museum.tulane.edu/geolocate/web/WebGeoref.aspx"
    class="lytebox" data-title="Get Latitude/Longitude from Locality Data" data-lyte-
    options="width:1000px height:780px scrollbars:no"><img title="Click to georeference
    location using GEOLocate." alt="" height="16" src="images/world.png" width="16"
    class="auto-style5"></a>

这会在 onblur 事件触发后使用查询字符串更新基本 URL。一切都很好....

于 2013-03-01T21:40:03.550 回答