0

我有一个使用 XSLT 的 HTML 页面：这是一个使用 XSLT foreach 循环构建的动态列表。

<div data-role="content" id="contacts" data-c8o-listen=".GetContacts">

  <div data-role="collapsible-set" data-c8o-each="records">
    <div data-role="collapsible">
      <h3>{FirstName}&nbsp;{LastName}</h3>

        <label><b>Company:&nbsp;</b></label><span>{Company}</span><br/>
        <label><b>Phone:&nbsp;</b></label><span>{Phone}</span><br/>
        <label><b>Street:&nbsp;</b></label><span>{Street}</span><br/>
        <label><b>City:&nbsp;</b></label><span>{City}</span><br/>
        <label><b>Country:&nbsp;</b></label><span>{Country}</span>
        <button class="gm">Google map</button>
        <!-- >button data-c8o-call=".ReadContact" >
          Get Details<span style="visibility:hidden"
                        data-c8o-variable="ID">{Id:first}</span>
        </button-->
    </div>
  </div>

我需要以某种方式添加一个按钮或指向 Google 地图的链接

var loc = Country + "," + State + ","  + Street;
var addr = "https://maps.googleapis.com/maps/api/staticmap?center=" + loc +
    "&zoom=14&size=288x300&sensor=false";

我怎么能用 jQuery 做到这一点？因为列表是动态的，我无法分配 ID。

4

1 回答 1

1

听起来你想用它$('selector').each(fn)来迭代可折叠的 div。

然后，您的函数fn(index, element)将使用element参数（或this）来计算当前 div 的 Country 等。

最后，您可以使用以下内容添加链接：

$(this).append('<a href="' + addr + '">Google maps</a>');

我正在对条件和要求进行一些猜测，所以如果上述内容不能满足您的需求，请告诉我我猜错的地方。

更新

一个例子，回应评论。起初我拒绝举一个例子，因为我必须猜测细节。但考虑到这一点...

$('div[data-role="collapsible"]').each(function(index, element) {
   // ... your code to extract Country etc. from this or element arg. ...

   var loc = Country + "," + State + ","  + Street;
   var addr = "https://maps.googleapis.com/maps/api/staticmap?center=" +
      loc + "&zoom=14&size=288x300&sensor=false";
   $(this).append('<a href="' + addr + '">Google maps</a>');
});
于 2013-06-17T14:10:55.747 回答