我有一个表，它有几行，每行有两个单元格，每个单元格都有一些信息，比如办公室名称、地址和电话号码等。使用jquery，每个单元格的地址都会从每个单元格中提取出来，并输入到谷歌地图地理编码对象中，以获取点并将其绘制在地图中。现在，在每次命中Address值时，我还想从jquery获取地址值的当前单元格中获取电话和办公室名称的唯一值。。我需要这些值，以便在地图的信息窗口中显示这些值？我如何获得这些值？
<table class="OfficeInfo" border="0" style="width: 100%" cellspacing="10px" cellpadding="15px">
<tr>
<td class="Office1" style="width=40%">
<span class="OfficeName">
<div id="ctl00_PlaceHolderMain_ctl00_ctl17_label" style='display:none'>Office1Link</div><div id="ctl00_PlaceHolderMain_ctl00_ctl17__ControlWrapper_RichLinkField" class="ms-rtestate-field" style="display:inline" aria-labelledby="ctl00_PlaceHolderMain_ctl00_ctl17_label"><div class="ms-rtestate-field"><a href="/" target="_blank">St. Francis Hospital</a></div></div>
</span>
<span class="Address">
2001 86th Street West <br />Indianapolis, IN 46260
</span> <br />
<span class="Phone">
(402) 123-1234</span><br /><br />
<a class="mapdirectionsLink" href="#">map & directions></a><br /><br />
<span class="Hours">
MTW:9:00AM-5:00PM</span>
</td>
<td class="Office2" style="width:40%">
<span class="OfficeName">
<div id="ctl00_PlaceHolderMain_ctl00_ctl21_label" style='display:none'>Office2Link</div><div id="ctl00_PlaceHolderMain_ctl00_ctl21__ControlWrapper_RichLinkField" class="ms-rtestate-field" style="display:inline" aria-labelledby="ctl00_PlaceHolderMain_ctl00_ctl21_label"><div class="ms-rtestate-field"><a href="/" target="_blank">St. Margaret's Hospital</a></div></div>
</span>
<span class="Address">
8075 North Shadeland Avenue <br />Indianapolis, IN 46250</span><br />
<span class="Phone">
(316) 123-3245</span><br /><br />
<a class="mapdirectionsLink" href="#">map & directions></a><br /><br />
<span class="Hours">
MTW:9:00AM-5:00PM</span>
</td>
</tr>
<tr>
<td class="Office3" style="border-top:1px dotted silver; width:40%;">
<span class="OfficeName">
<div id="ctl00_PlaceHolderMain_ctl00_ctl25_label" style='display:none'>Office3Link</div><div id="ctl00_PlaceHolderMain_ctl00_ctl25__ControlWrapper_RichLinkField" class="ms-rtestate-field" style="display:inline" aria-labelledby="ctl00_PlaceHolderMain_ctl00_ctl25_label"><div class="ms-rtestate-field"><a href="/" target="_blank">Munster Women's Center</a></div></div>
</span>
<span class="Address">
395 Westfield Road <br />Noblesville, IN 46060</span><br />
<span class="Phone">
(316) 123-3245</span><br /><br />
<a class="mapdirectionsLink" href="#">map & directions></a><br /><br />
<span class="Hours">
MTW:9:00AM-5:00PM</span>
</td>
<td style="border-top:1px dotted silver; width:40%">
</td>
</tr>
</table>
function codeAddress() {
var infowindow = new google.maps.InfoWindow({});
$('span.Address').each(function(index) {
var addy = $(this).text();
var off_name = $(this).siblings('.OfficeName').children(.ms-rtestate-field).text();
var infowindow = new google.maps.InfoWindow({ content: 'Hello world' });
geocoder.geocode( { 'address': addy}, function(results, status) {
if (status == google.maps.GeocoderStatus.OK) {
map.setCenter(results[0].geometry.location);
var marker = new google.maps.Marker({
map: map,
position: results[0].geometry.location,
title:addy
});
//var currentCell=(this).closest(td).html());
// Adding a click event to the marker
google.maps.event.addListener(marker, 'click', function() {
infowindow.setContent('<span style="color:#808080; font-size:13px; font-family:Trebuchet">'+addy
+'<br> <a href="http://maps.google.com/maps?saddr=&daddr=' + this.position.toUrlValue() + '" target ="_blank">Get Direction To Here</a>'+
off_name + '</span>');
infowindow.open(map, this);
});
} else {
alert("Geocode was not successful for the following reason: " + status);
}
});
});
}
根据this的当前上下文，这应该有效：
$(this).parent().find('.officeName').html();
$(this).siblings('.Phone').html()和$(this).siblings('.Address').html()
我们可以通过使用jquery或Javascript来实现这一点。在这里，我们将讨论电子邮件id更新。
在下面的示例中，将打开一个弹出窗口，其中包含来自父窗口的自动填充电子邮件id。更新后，一封电子邮件将在父窗口文本框中自动更新，弹出的窗口将自动关闭。
示例：
1( 创建文件index.html作为父窗口
<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.0 Transitional//EN”>
<html>
<title></title>
<head></head>
<body>
<table>
<tr>
<td colspan=”2″>Example for update email id.</td>
</tr>
<tr>
<td>Email Id:</td>
<td>
<input type=’text’ name=”emailID” id=”emailId” value=”demo@demo.com”></td>
</tr>
<tr>
<td>
<input type=”button” name=”update” value=”Update”
onClick=’window.open(“update_popup.html”, “”, “width=400, height=300″)’>
</td>
</tr>
</table>
</body>
</html>
2( 创建文件update_popup.html作为弹出窗口，其中电子邮件id从父窗口自动填充以进行更新。
<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.0 Transitional//EN”>
<html>
<title></title>
<head></head>
<script src=”http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js”></script>
<script>
$(document).ready(function(){
//== pre fill parent window email id in popup window for update
var emailId = window.opener.document.getElementById(“emailId”).value;
$(“#emailId”).val(emailId);
//=== update updated email id in to parent window
$(“#Save”).on(‘click’,function(){
var updated_emailId = $(“#emailId”).val();
window.opener.document.getElementById(“emailId”).value = updated_emailId;
window.close();
});
});
</script>
<body>
<table>
<tr>
<td>Email Id:</td>
<td>
<input type=’text’ name=”emailID” id=”emailId” value=””></td>
</tr>
<tr>
<td><input type=”button” name=”Save” id=”Save” value=”Save”></td>
</tr>
</table>
</body>
</html>
了解更多详细信息。。
http://www.delhincrjob.com/blog/how-to-get-the-parent-window-element-value-in-popup-window-using-jquery/
$('td.Office1').chilldren('.Phone')
将从Office 1 td 获得Office 1的电话号码
$('span.Address').siblings('.Phone')
将从地址范围中获取电话号码
这里有一个小而简单但很适合初学者的Jquery PDF。试着使用Jquery备忘单，因为它包含了大多数问题的解决方案。
$(this).parent().find(".OfficeName").text()获取办公室名称，$(this).parent().find(".Phone").text()获取每个地址的电话。
jsfiddle-点击地址，它会在警报中显示姓名和电话。