- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
所以我的页面上有这张世界地图,但我似乎无法让这一切正常工作。我已正确映射图像并使其响应...但我无法从单击以填充区域分类文本字段输入的 map 区域获取标题属性。我对整个 jQuery 领域不是很了解,所以任何帮助都会很棒。
这是我正在使用的代码:
<img src="img/map.svg.png" class="map" width="2000" height="1057" alt="Insert Alt" usemap="#image_map" border="0">
<map name="image_map" id="image_map">
<area shape="poly" class="region" data-toggle="tooltip" coords="" href="javascript:;" title="red"/>
<area shape="poly" class="region" data-toggle="tooltip" coords=" 309,238" href="javascript:;" title="green"/>
<area shape="poly" class="region" data-toggle="tooltip" coords=" 222,276, 202,295, 1,299, 6,124, 162,148, 160,236, 225,277" href="javascript:;" title="Alaska"/>
<area shape="poly" class="region" data-toggle="tooltip" coords=" 54,474, 136,522, 74,558, 32,504, 57,474" href="javascript:;" title="Hawaii"/>
<area shape="poly" class="region" data-toggle="tooltip" coords=" 167,149, 167,235, 263,324, 607,354, 639,201, 530,92, 169,148" href="javascript:;" title="Canada"/>
<area shape="poly" class="region" data-toggle="tooltip" coords=" 251,330, 257,442, 415,485, 512,489, 607,358, 252,328" href="javascript:;" title="USA"/>
<area shape="poly" class="region" data-toggle="tooltip" coords=" 298,458, 423,492, 473,511, 422,558, 297,480, 298,461" href="javascript:;" title="Mexico"/>
<area shape="poly" class="region" data-toggle="tooltip" coords=" 429,557, 467,523, 524,584, 501,615, 431,561" href="javascript:;" title="Central America"/>
<area shape="poly" class="region" data-toggle="tooltip" coords=" 1052,267, 1116,354, 1086,411, 1101,427, 893,411, 880,236, 1056,268" href="javascript:;" title="Western Europe"/>
<area shape="poly" class="region" data-toggle="tooltip" coords=" 547,568, 481,638, 494,1014, 619,1030, 786,666, 572,553, 546,567" href="javascript:;" title="South America"/>
<area shape="poly" class="region" data-toggle="tooltip" coords=" 474,497, 512,548, 601,532, 550,496, 478,497" href="javascript:;" title="Carribean"/>
<area shape="poly" class="region" data-toggle="tooltip" coords=" 1026,822, 1140,785, 1137,849, 1044,881, 1024,821" href="javascript:;" title="South Africa"/>
<area shape="poly" class="region" data-toggle="tooltip" coords=" 846,417, 1116,428, 1195,570, 1239,570, 1233,807, 1145,781, 1023,819, 958,635, 846,630, 847,412" href="javascript:;" title="Africa"/>
<area shape="poly" class="region" data-toggle="tooltip" coords=" 807,173, 884,186, 863,223, 795,225, 811,165" href="javascript:;" title="Iceland"/>
<area shape="poly" class="region" data-toggle="tooltip" coords=" 971,247, 1055,264, 1119,354, 1095,412, 1132,432, 1140,417, 1195,406, 1222,395, 1218,374, 1093,248, 1116,147, 1051,126, 973,180, 972,246" href="javascript:;" title="Eastern Europe"/>
<area shape="poly" class="region" data-toggle="tooltip" coords=" 1728,642, 1729,709, 1601,721, 1554,774, 1575,911, 1793,960, 1933,966, 1960,874, 1937,698, 1732,645" href="javascript:;" title="Australia"/>
<area shape="poly" class="region" data-toggle="tooltip" coords=" 1440,509, 1441,463, 1586,505, 1642,531, 1726,641, 1724,705, 1440,721, 1442,512" href="javascript:;" title="Southeast Asia"/>
<area shape="poly" class="region" data-toggle="tooltip" coords=" 1373,420, 1355,425, 1327,499, 1380,613, 1413,614, 1437,509, 1431,471, 1376,423" href="javascript:;" title="India"/>
<area shape="poly" class="region" data-toggle="tooltip" coords=" 1199,566, 1134,440, 1144,421, 1232,397, 1208,316, 1319,277, 1427,324, 1313,518, 1202,566" href="javascript:;" title="Middle East"/>
<area shape="poly" class="region" data-toggle="tooltip" coords=" 1439,318, 1379,415, 1493,469, 1608,508, 1693,376, 1644,291, 1431,319" href="javascript:;" title="China"/>
<area shape="poly" class="region" data-toggle="tooltip" coords=" 1725,348, 1771,368, 1670,472, 1659,447, 1725,352" href="javascript:;" title="Japan"/>
<area shape="poly" class="region" data-toggle="tooltip" coords=" 1154,23, 1099,245, 1187,315, 1331,271, 1423,314, 1658,286, 1700,365, 1747,347, 1808,353, 1988,212, 1986,125, 1542,7" href="javascript:;" title="Russian"/>
</map>
</div>
</div>
<div class="regionspacing">
<label for="region">Region</label>
<input type="text" id="region" name="region" class="form-control input-md">
</div>
<script>
$(document).ready(function(e) {
$('img[usemap]').rwdImageMaps();
});
</script>
<script>
$(document).ready(function() {
$('[data-toggle="tooltip"]').tooltip({trigger: 'hover','placement': 'top'});
$(function(){
$('area').live('click', function() {
$("#region").val($(this).attr('title'));
});
});
</script>
这是网站本身的链接,它正在运行新的 Bootstrap ...www.zoomglobaltravel.com/perfect.html(区域字段还没有在那里......)
请帮忙:?
最佳答案
$('#image_map').on('click', 'area', function (e) {
$('#region').val(e.target.title);
});
基本上,您将点击事件监听器附加到所有 <area>
位于#image_map
。在此监听器中,您将获得 title
单击区域的属性并将其设置为 #region
的值输入框。
关于javascript - Jquery脚本将图像 map 区域的标题放入文本输入表单?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24027876/
在使用 GDI 进行图形处理的传统 Windows 程序中,您必须担心只绘制需要重绘的窗口区域;这是“更新矩形”,可以通过 PAINTSTRUCT.rcPaint 或通过调用 GetUpdateRec
我对 TFS 中的所有内容感到困惑。有人可以解释一下所有这些是如何组合在一起的吗? 团队项目合集 团队项目 团队 地区 迭代 来自 this page,我认为一个(团队)项目集合可以包含多个(团队)项
这对我来说根本没有意义。创建新的 API 网关时,您可以指定它是区域优化的还是边缘优化的。但话又说回来,当您为 API Gateway 创建自定义域名时,您可以在两者之间进行选择。 最糟糕的是,您可以
我有一个工作表,其中包含我想循环遍历的许多不同区域。我将进行一些计算,并认为它比在列中逐个单元格地更快/更有效。 我尝试了一些不同的东西,但不知道如何跳到下一个区域。我已经发表了一些评论,最有希望的是
最近迁移到 TFS 2010 后,我想知道对于区域而言,最佳或最广泛接受的定义或配置是什么? 我能在网上找到的唯一有用的文章是 this one并且是我认为是正确的。然而,这让我开始思考是否以下任何一
我在“北欧”有一个存储帐户,现在我想使用生命周期管理将冷 blob 移动到存档层。 但是我每次尝试都会遇到以下失败:无法为存储帐户“myStorageAccount”添加生命周期管理规则。错误:管理策
我正在开发一个项目,您在扫描仪中输入州的缩写,然后程序会告诉您该州位于美国的哪个地区。我认为我的大部分代码都是正确的,但我有以前从未使用过 switch。 我已经将我的工作改进为一个错误,即我的第一个
我正在尝试学习 AngularJS,我想我有一个架构问题。 如果我想开始开发一个应用程序,比方说,比如 youtube,我如何在“区域”(比如 Marionette)中组织页面?我的意思是:顶部导航栏
我正在制作一个动态内存分配器,当我释放其中的一部分时,我需要检查我传递给函数的指针实际上是否在该区域内。我有一个指向 malloc 区域开头的指针 typedef unsigned char byte
有时我想看看 到底在哪里页面上图片上的标签。 在 Javascript 中有没有办法改变颜色或隐藏与区域标签对应的图像部分? 最佳答案 也许您正在寻找类似 mapper.js 的内容.它允许您在鼠标
我有一个使用 D3 js 创建的时间序列图表。我想为特定时间间隔添加高亮区域,以显示在该特定时间发生的特定事件(会有不同类型的事件,因此每个高亮标记将根据其类型具有不同的颜色)。我希望这个突出显示区域
我正在尝试创建网站的密码保护区。我想通过检查 MySql 表中的用户名和密码来允许访问,然后启动一个 session 并允许在 session 处于事件状态时访问多个页面。如果有人尝试直接访问这些页面
在 ScrollView 中我添加了几个按钮。正如您在图片中看到的,2 个按钮完全可见,第三个按钮半可见。当我向右滚动看到第三个时;1-如果滚动条很短,则它会滚动回到第一个位置。2- 如果滚动足够则显
我正在开发我的第一个 spritekit 应用程序,并且有一个关于如何处理我想到的事情的快速问题。我正在制作一个我想要的棋盘游戏原型(prototype),并希望在 iOS map 中进行一些集思广益
在我的 C# 程序中,我收到这样的日期和时间:DateTime.Now 我得到:19/09/2010 20:10:30 因为我的地区是:希伯来语(以色列) 但是如果我将我的程序安装在区域为 Engli
有时我在 Visual Studio 的源文件中运行(在我的例子中是 2010),我看到很多区域,我必须点击 + 号才能一个一个地打开它们! 是否有任何快捷方式或菜单选项可以使这对我来说更容易,并且对
关闭。这个问题是opinion-based .它目前不接受答案。 想要改进这个问题? 更新问题,以便 editing this post 可以用事实和引用来回答它. 关闭 7 年前。 Improve
我正在寻找二维数据中的峰值区域(如果您愿意,灰度图像或二维景观,通过霍夫变换创建)。 峰值区域是指局部最大峰值,但不是单个点而是周围的一部分strong>contributing region 随之而
我希望能够将任何字符或字符串转换为形状或区域,以便我可以按照我喜欢的任何大小、样式、效果等来绘制该字符。 更具体地说,我将使用视差绘制它,以便它仅在特定角度清晰定义(这就是为什么我不能使用 html
我非常喜欢数学(或者你们大多数人会说的“数学”!),但我还没有达到知道这个问题答案的程度。我有一个主圆,它可以在显示器上的任何 x 和 y 处有一个中心点。其他圆圈将随意在显示器周围移动,但在任何给定
我是一名优秀的程序员,十分优秀!