Jquery：变量作为 ID 选择器不起作用
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/5787746/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Jquery: variable as ID selector not working
提问by George Reith
Ok here is my code:
好的，这是我的代码：
$tabularID = 0;
$('a.swfselector').live('mouseover', function(event) {
$tabularID= $(this).parent().attr('id');
$(this).parent().children().not(this).find('.tab').each(function() {
$(this).fadeTo(100, 0.4)
})
$(this).find('.tab').each(function() {
$(this).fadeTo(100,1)
})
});
$('#' + $tabularID).live('mouseleave', function(event) {
alert($tabularID);
$(this).children().find('.tab').each(function() {
$(this).fadeTo(100,1)
})
});
Jquery doesn't like this selector:
Jquery 不喜欢这个选择器：
$('#' + $tabularID)
Although if I change it to:
虽然如果我将其更改为：
$('#27')
It alerts my variable $tabularID just fine, so I know it isn't the variable that is wrong (Output of $tabularID is 27). I need a variable here because the parent ID changes depending on which they mouseover.
它提醒我的变量 $tabularID 就好了，所以我知道它不是错误的变量（$tabularID 的输出是 27）。我在这里需要一个变量，因为父 ID 会根据鼠标悬停的位置而变化。
Anyone can see what I can't? probably really obvious.
谁能看到我看不到的东西？可能真的很明显。
回答by YNhat
Your ID must begin with a letter a-z or A-Z.
您的 ID 必须以字母 az 或 AZ 开头。
This code $('#' + $tabularID) is only affected at the first time you run it. It means your $tabularID = 0.
此代码 $('#' + $tabularID) 仅在您第一次运行时受到影响。这意味着您的 $tabularID = 0。
When you mouse over it only update the $tabularID value, but it will not update the binding to event of this object $('#' + $tabularID)
当您将鼠标悬停在它上面时，只会更新 $tabularID 值，但不会更新此对象 $('#' + $tabularID) 的事件绑定
I think you can change your code like this:
我认为您可以像这样更改代码：
$tabularID = 0;
$('a.swfselector').live('mouseover', function(event) {
$tabularID= $(this).parent().attr('id');
$(this).parent().children().not(this).find('.tab').each(function() {
$(this).fadeTo(100, 0.4)
})
$(this).find('.tab').each(function() {
$(this).fadeTo(100,1)
})
$('#' + $tabularID).live('mouseleave', function(event) {
alert($tabularID);
$(this).children().find('.tab').each(function() {
$(this).fadeTo(100,1)
})
});
});
回答by CoolEsh
I often use variables in selectors. And all works fine for me this way. Just avoid using IDs like '123'. ID naming rules:
我经常在选择器中使用变量。这样对我来说一切都很好。只是避免使用像“123”这样的 ID。ID命名规则：
- Must begin with a letter A-Z or a-z
- Can be followed by: letters (A-Za-z), digits (0-9), hyphens ("-"), underscores ("_"), colons (":"), and periods (".")
- Values are case-sensitive
- 必须以字母 AZ 或 az 开头
- 后面可以跟：字母 (A-Za-z)、数字 (0-9)、连字符 ("-")、下划线 ("_")、冒号 (":") 和句点 (".")
- 值区分大小写
回答by Superbyte
I've also encountered this problem with jQuery but found out that regular JavaScript DOM can handle ID's that start with numbers if that's the problem. This might nog help in this case, but it might be worth looking at if it is easier to change that piece of code rather than changing how your ID's are set up.
我在 jQuery 中也遇到过这个问题，但发现常规 JavaScript DOM 可以处理以数字开头的 ID，如果这是问题所在。在这种情况下，这可能会有所帮助，但如果更改该代码段比更改 ID 的设置方式更容易，则可能值得研究。
document.getElementById(tabularID)
Note that you don't need '#' in the beginning.
请注意，开头不需要“#”。
