Jquery - 将选定的行值传递给隐藏文本框

Question

我正在进行邮政编码(机场和火车站)搜索,但似乎无法弄清楚为什么所选行值没有将正确的值写入隐藏文本框.

基本上如果我搜索'Gatwick'如下所示:

我得到以下XML响应:

<?xml version="1.0"?>
<addresslist resultcount="4">
    <address id="0" catagoryid="1" lat="184179968" lng="-639296">
        <companyname></companyname>
        <premiseno></premiseno>
        <streetname>GATWICK AIRPORT (NORTH)</streetname>
        <townname></townname>
        <postcode>RH6 0PJ</postcode>
    </address>
    <address id="1" catagoryid="1" lat="184161536" lng="-586944">
        <companyname></companyname>
        <premiseno></premiseno>
        <streetname>GATWICK AIRPORT (SOUTH)</streetname>
        <townname></townname>
        <postcode>RH6 0NP</postcode>
    </address>
    <address id="2" catagoryid="1" lat="184161664" lng="-580224">
        <companyname></companyname>
        <premiseno></premiseno>
        <streetname>GATWICK GATWICK AIRPORT RAILWAY STATION</streetname>
        <townname></townname>
        <postcode>RH6 0RD</postcode>
    </address>
    <address id="3" catagoryid="1" lat="184161536" lng="-586944">
        <companyname></companyname>
        <premiseno></premiseno>
        <streetname>GATWICK RAILWAY CONCOURSE</streetname>
        <townname></townname>
        <postcode>RH6 0NN</postcode>
    </address>
</addresslist>

目前,无论我选择哪一行,它总是将最后的Lat&Long值写入隐藏文本框.例如,如果我选择第一行,它将写入184161536, -586944'GATWICK RAILWAY CONCOURSE'的Lat Long值

这是Jquery代码:

function buildResultView(xml_object,pageNum,rowdiv) {

// Remove existing page up page down click events
rowdiv.find('.lbl-addr-pgup').unbind('click');
rowdiv.find('.lbl-addr-pgdn').unbind('click');

// Remove result list if there is one
if (rowdiv.find('.ul-result-view')) {
    rowdiv.find('.ul-result-view').remove();
}

ul = $('<ul></ul>');
ul.addClass('ul-addr-res');
ul.addClass('ul-result-view');

// Prepend ul before resultinfo
rowdiv.find('.div-result-info').before(ul); 

// Reset result count
var resCount = 0;

// Count Results
$(xml_object).find('address').each(function(){
    resCount += 1;
});

// Pull out start row and max rows
var pageRes = clientPaginate(resCount,pageNum).split(',');
var loopMax = parseInt(pageRes[0]);
var currentRow = parseInt(pageRes[1]);
var lastPge = parseInt(pageRes[2]);
var addType;

// Show maxRows starting at startIndex  
for (var i = currentRow; i < loopMax; i++) {

    var li = $('<li></li>');
    li.addClass('li-addr-res');
    addType = parseInt($(xml_object).find("address[id='"+i+"']").attr("catagoryid"));
    var lat = ($(xml_object).find("address[id='"+i+"']").attr("lat"));
    var lng = ($(xml_object).find("address[id='"+i+"']").attr("lng"));

    li.css('cursor','pointer');

// Reset result count
var resCount = 0;

// Count Results
$(xml_object).find('address').each(function(){
    resCount += 1;
});

// Pull out start row and max rows
var pageRes = clientPaginate(resCount,pageNum).split(',');
var loopMax = parseInt(pageRes[0]);
var currentRow = parseInt(pageRes[1]);
var lastPge = parseInt(pageRes[2]);
var addType;

// Show maxRows starting at startIndex  
for (var i = currentRow; i < loopMax; i++) {

    var li = $('<li></li>');
    li.addClass('li-addr-res');
    addType = parseInt($(xml_object).find("address[id='"+i+"']").attr("catagoryid"));
    var lat = ($(xml_object).find("address[id='"+i+"']").attr("lat"));
    var lng = ($(xml_object).find("address[id='"+i+"']").attr("lng"));

然后我将lat,lng值写入隐藏文本框:

    // Add this lat lng to hidden text box
    rowdiv.find('.hidden-lat-lng').val(lat+","+lng);

知道为什么没有选择正确的纬度经度值吗？

我只需要能够获得所选行的纬度经度值.

如果有人可以帮忙解决这个问题,我会非常感激!:-)

Answer 1

当你有这样的代码:

for (var i = 0; i < 10; i++) {
   var foo = i;
}

foo将会是9.这就是正在发生的事情,你的lat和lng价值观只是循环中的最后一个,因为那就是你设置它们的地方.

请注意,无论是foo在for()循环内部还是在循环内部声明都无关紧要; javascript中的变量范围不是像许多其他语言中的块级别一样,并且使用var将赋予这些函数的范围.

你也试图重新声明变量; 我不确定这只是复制粘贴代码的结果还是对变量范围的误解,但无论如何它都没有后续影响.如果你只是在函数的顶部声明你的局部变量,它会更清楚并且可能导致更少的陷阱.

可能有更多代码处理选择哪一行.如果设置lat和lng然后将其张贴到你的问题.否则,这是我的看法:

for (var i = currentRow; i < loopMax; i++) {
    var li = $('<li></li>');
    li.addClass('li-addr-res');
    addType = parseInt($(xml_object).find("address[id='"+i+"']").attr("catagoryid"));

    lat = ($(xml_object).find("address[id='"+i+"']").attr("lat"));
    lng = ($(xml_object).find("address[id='"+i+"']").attr("lng"));

    // Store the latitude and longitude alongside the li element itself
    li.data('lat', lat).data('lng', lng);

    // add a handler to copy that data to the hidden textarea when clicked
    // I'm assuming you mean the row is selected when it's clicked, otherwise
    // just bind to something else
    li.click(function() {        
        // recover the data from this element (the <li>)
        var lat = $(this).data('lat'),
            lng = $(this).data('lng');

        // rowdiv is probably still in scope from the parent function,
        // though there is missing code in your question. I'm going to 
        // assume there's only one hidden textarea for this purpose
        $('.hidden-lat-lng').val(lat + "," + lng);
    }