- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
请参阅 here 我最近问的一个问题。您应该查看的唯一答案是被选为最佳答案的答案。根据该问题的建议,我通过使用数组和循环使我的代码(在一个部分中)更加简洁。并且有效!
我认为我应该对代码的另一部分执行相同的操作,该部分具有类似的代码冗余。但是,改了代码之后,就不行了。
您知道可能是什么问题吗?
$(document).ready(function()
{
$("#container").click(function(e)
{
// Added to avoid confusion. Not all variables are not posted,
// but they are present in my actual code.
var areaX = x/xScale;
var areaY = y/yScale;
// Arrays containing the min and max x and y values of the rectangular area around a farm
var minX = [47, 593, 593, 958, 600, 744, 852, 1025, 1060, 1159, 1366];
var maxX = [553, 958, 792, 1011, 1124, 1124, 1149, 1598, 1280, 1623, 1551];
var minY = [250, 250, 473, 349, 526, 665, 495, 248, 471, 520, 481];
var maxY = [330, 473, 515, 478, 665, 721, 526, 471, 500, 763, 520];
/** Loops through the values within the coordinate arrays to
determine if the user clicked within a certain area **/
for (var i = 0; i < minX.length; i++)
{
if(areaX >= minX[i] && areaX <= maxX[i] && areaY >= minY[i] && areaY <= maxY[i])
{
if(i = 0)
{
$("#region1").toggle(); //toggle on
}
if(i > 0 && i < 4) // 1-3
{
$("#region2").toggle(); //toggle on
}
if(i > 3 && i < 7 ) // 4-6
{
$("#region3").toggle(); //toggle on
}
if(i > 6 && i < 9) // 7-8
{
$("#region4").toggle(); //toggle on
}
if(i > 8 && i < 11) // 9-10
{
$("#region5").toggle(); //toggle on
}
$("#container").toggle(); //toggle off
$("#backButton").toggle(); //toggle on
}
}
});
});
我将继续发布我之前拥有的代码,该代码运行正常。请注意,此代码与上述代码具有相同的功能,但我没有重新发布这些功能。此外,我确实遗漏了一些代码(例如构成您在下面看到的第一组变量的变量),因为它们不应该与问题/解决方案相关。
var Panhandle_X = x/xScale;
var Panhandle_Y = y/yScale;
var region2_X = x/xScale;
var region2_Y = y/yScale;
var region3_X = x/xScale;
var region3_Y = y/yScale;
var region4_X = x/xScale;
var region4_Y = y/yScale;
var region5_X = x/xScale;
var region5_Y = y/yScale;
//Switches the displayed div to Panhandle
if(Panhandle_X >= 47 && Panhandle_X <= 553 && Panhandle_Y >= 250 && Panhandle_Y <= 330)
{
$("#region1").toggle(); //toggle on
$("#container").toggle(); //toggle off
$("#backButton").toggle(); //toggle on
}
//Switches the displayed div to region 2
if(region2_X >= 593 && region2_X <= 958 && region2_Y >= 250 && region2_Y <= 473)
{
$("#region2").toggle(); //toggle on
$("#container").toggle(); //toggle off
$("#backButton").toggle(); //toggle on
}
if(region2_X >= 593 && region2_X <= 792 && region2_Y >= 473 && region2_Y <= 515)
{
$("#region2").toggle(); //toggle on
$("#container").toggle(); //toggle off
$("#backButton").toggle(); //toggle on
}
if(region2_X >= 958 && region2_X <= 1011 && region2_Y >= 349 && region2_Y <= 478)
{
$("#region2").toggle(); //toggle on
$("#container").toggle(); //toggle off
$("#backButton").toggle(); //toggle on
}
//Switches the displayed div to region 3
if(region3_X >= 600 && region3_X <= 1124 && region3_Y >= 526 && region3_Y <= 665)
{
$("#region3").toggle(); //toggle on
$("#container").toggle(); //toggle off
$("#backButton").toggle(); //toggle on
}
if(region3_X >= 744 && region3_X <= 1124 && region3_Y >= 665 && region3_Y <= 721)
{
$("#region3").toggle(); //toggle on
$("#container").toggle(); //toggle off
$("#backButton").toggle(); //toggle on
}
if(region3_X >= 852 && region3_X <= 1149 && region3_Y >= 495 && region3_Y <= 526)
{
$("#region3").toggle(); //toggle on
$("#container").toggle(); //toggle off
$("#backButton").toggle(); //toggle on
}
//Switches the displayed div to region 4
if(region4_X >= 1025 && region4_X <= 1598 && region4_Y >= 248 && region4_Y <= 471)
{
$("#region4").toggle(); //toggle on
$("#container").toggle(); //toggle off
$("#backButton").toggle(); //toggle on
}
if(region4_X >= 1060 && region4_X <= 1280 && region4_Y >= 471 && region4_Y <= 500)
{
$("#region4").toggle(); //toggle on
$("#container").toggle(); //toggle off
$("#backButton").toggle(); //toggle on
}
//Switches the displayed div to region 5
if(region5_X >= 1159 && region5_X <= 1623 && region5_Y >= 520 && region5_Y <= 763)
{
$("#region5").toggle(); //toggle on
$("#container").toggle(); //toggle off
$("#backButton").toggle(); //toggle on
}
if(region5_X >= 1366 && region5_X <= 1551 && region5_Y >= 481 && region5_Y <= 520)
{
$("#region5").toggle(); //toggle on
$("#container").toggle(); //toggle off
$("#backButton").toggle(); //toggle on
}
编辑如前所述,我尝试循环遍历数组的新代码不起作用。它(通常)不会识别任何点击,因此不会切换。有时,如果我重新加载页面并先在 region1 中单击,它会使容器 div 关闭并打开按钮,但按钮将无法识别点击,而且 region1 div 未打开。
最佳答案
一些想法,虽然你没有提到你有什么“问题”,除了“它不起作用”。 损坏的部分很可能是您没有发布的代码块,特别是获取鼠标坐标的部分。我没有看到任何设置 areaX
的代码或 areaY
1) 如果您使用互斥区域,请使用else
。一旦一个区域匹配,就没有理由检查下一个区域。您还只需要检查上限,因为使用 else
默认情况下您会得到下限:
if (i = 0) {
$("#region1").toggle(); //toggle on
} else if (i < 4) { // 1-3
$("#region2").toggle(); //toggle on
} else if (i < 7) { // 4-6
...
2) 但是,您可以通过对您的区域进行数组查找来大大简化,而不是大if/then/else
:
$(document).ready(function() {
// Arrays containing the min and max x and y values of
// the rectangular area around a farm
var minX = [47, 593, 593, 958, 600, 744, 852, 1025, 1060, 1159, 1366];
var maxX = [553, 958, 792, 1011, 1124, 1124, 1149, 1598, 1280, 1623, 1551];
var minY = [250, 250, 473, 349, 526, 665, 495, 248, 471, 520, 481];
var maxY = [330, 473, 515, 478, 665, 721, 526, 471, 500, 763, 520];
// Lookup array
var region = [1,2,2,2,3,3,3,4,4,5,5];
$("#container").click(function(e) {
// Loops through the values within the coordinate arrays to
// determine if the user clicked within a certain area
for (var i = 0; i < minX.length; i++) {
if (areaX >= minX[i] && areaX <= maxX[i] &&
areaY >= minY[i] && areaY <= maxY[i]) {
// Lookup of region for 'i'
$("#region"+region[i]).toggle(); //toggle on
$("#container").toggle(); //toggle off
$("#backButton").toggle(); //toggle on
}
}
});
});
没有你的更多代码,我不确定哪里出了问题,但我在这里拼凑了一个似乎有效的 jsfiddle 演示:
http://jsfiddle.net/jtbowden/3AWHZ/
我做了一个快速而肮脏的 pageX/pageY 来获取鼠标坐标,并做了一些其他假设,但你可以看到区域切换。
关于javascript - JQuery/JS 数组 - 循环代码帮助,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/5466047/
我有这个问题: 我们声称对 float 使用相等测试是不安全的,因为算术运算会引入舍入错误,这意味着两个应该相等的数字实际上并不相等。 对于这个程序,您应该选择一个数字 N,并编写一个程序来显示 1
为什么这个脚本的输出是 5 而不是 8 ? 我认为 -- 意味着 -1 两次。 var x = 0; var y = 10; while ( x
我现在可以从 cmd 窗口中执行的 FFmpeg 过程中读取最后一行。 使用脚本主机模型对象引用此源。 Private Sub Command1_Click() Dim oExec
使用 vlookup,当匹配发生时,我想从匹配发生的同一行显示工作表 2 中 C 列的值。我想出的公式从 C 列表 2 中获取值,但它从公式粘贴在表 3 上的行中获取,而不是从匹配发生的位置获取。 这
我在破译 WCF 跟踪文件时遇到了问题,我希望有人能帮助我确定管道中的哪个位置发生了延迟。 “Processing Message XX”的跟踪如下所示,在事件边界和传输到“Process Actio
我有四个表,USER、CONTACT、CONACT_TYPE 和 USER_CONTACT USER_CONTACT 存储用户具有填充虚拟数据的表的所有联系人如下 用户表 USER_ID(int)|
以下有什么作用? public static function find_by_sql($sql="") { global $database; $result_set = $data
我正在解决 JavaBat 问题并且对我的逻辑感到困惑。 这是任务: Given a day of the week encoded as 0=Sun, 1=Mon, 2=Tue, ...6=Sat,
我正在研究一些 Scala 代码,发现这种方法让我感到困惑。在匹配语句中,sublist@ 是什么?构造?它包含什么样的值(value)?当我打印它时,它与 tail 没有区别,但如果我用尾部替换它,
我正在使用以下代码自行缩放图像。代码很好,图像缩放也没有问题。 UIImage *originImg = img; size = newSize; if (originImg.size.width >
Instruments 无法在我的 iPad 和 iPhone 上启动。两者都已正确配置,我可以毫无问题地从 xcode 调试它们上的代码,但 Instruments 无法启动。 我听到的只是一声嘟嘟
我想用 iPhone 的 NSRegularExpression 类解析此文本: Uploaded652.81 GB 用于摘录上传和652.81文本。 最佳答案 虽然我确实认为 xml 解析器更适合解
我找到了 solution在 Stackoverflow 上,根据过滤器显示 HTML“li”元素(请参阅附件)。本质上基于 HTML 元素中定义的 css 类,它填充您可以从中选择的下拉列表。 我想
这是一个简单的问题,但我是在 SQL 2005 中形成 XML 的新手,但是用于形成如下所示表中的 XML 的最佳 FOR XML SQL 语句是什么? Column1 Column2 -
我在 www.enigmafest.com 有一个网站!您可以尝试打开它!我面临的问题是,在预加载器完成后,主页会出现,但其他菜单仍然需要很长时间才能加载,而且声音也至少需要 5 分钟! :( 我怎样
好吧,我正在尝试用 Haskell 来理解 IO,我想我应该编写一个处理网页的简短小应用程序来完成它。我被绊倒的代码片段是(向 bobince 表示歉意,但公平地说,我并不想在这里解析 HTML,只是
如何使用背景页面来突出显示网站上的某个关键字,无论网站是什么(谷歌浏览器扩展)?没有弹出窗口或任何东西,它只是在某人正在查看的网站上编辑关键字。我以前见过这样的,就是不明白怎么做!谢谢你的帮助。 最佳
我是 Javascript 新手,需要一些帮助。 先看图片: . 积分预测器应用程序。 基本上当用户通过单选按钮选择获胜团队时它应该在积分栏中为获胜队添加 10 分,并且并根据得分高的球队自动对表格进
这是我的情况 - 我要发送一份时事通讯,我试图做的是,当用户单击电子邮件中的链接时,它会重定向到我的网页,然后会弹出一个灯箱,显示视频。我无法在页面加载时触发灯箱,因为您可以在查看灯箱之前转到同一页面
我有这个代码。 ¿Cuanto es ? Ir 我想获取用户输入的“验证码”值。我尝试这个但行不通。有什么帮助吗? var campo = d
我是一名优秀的程序员,十分优秀!