jQuery 模糊（）不起作用？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/8290180/
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 blur() not working?
提问by 3Dom
Totally stumped here. Trying something pretty easy, but it's not working:
完全被困在这里。尝试一些非常简单的事情，但它不起作用：
$("input.input1, textarea.input1").focus(function(){
$(this).addClass("input2").removeClass("input1");
});
$("input.input2, textarea.input2").blur(function(){
$(this).addClass("input1").removeClass("input2");
});
Basically the blur isn't firing. I click on the input box and the box changes. I click away from the box and nothing happens. Any help with this would be awesome.
基本上模糊没有触发。我点击输入框，输入框发生变化。我点击远离盒子，什么也没有发生。对此的任何帮助都会很棒。
回答by tvanfosson
You need to use a delegated handler as the input doesn't have class input2at the time the handler is applied.
您需要使用委托处理程序，因为在应用处理程序时输入没有类input2。
$(document).on('focus','input.input1, textarea.input1', function() {
$(this).addClass('input2').removeClass('input1');
});
$(document).on('blur','input.input2, textarea.input2', function() {
$(this).addClass('input1').removeClass('input2');
});
There are probably better ways to do this, however. I'd suggest using a third class to mark the inputs that need the class toggled, then just toggle the classes when the event occurs.
然而，可能有更好的方法来做到这一点。我建议使用第三个类来标记需要切换类的输入，然后在事件发生时切换类。
$('.needsToggle').on('focus blur', function() {
$(this).toggleClass('input1 input2');
});
If they always have class input1to start, you could use that instead of needsToggle.
如果他们总是有课程input1要开始，您可以使用它而不是needsToggle.
回答by David says reinstate Monica
Because you're affecting the same elements, it's somewhat easier to chain:
因为您正在影响相同的元素，所以链接起来更容易：
$("input.input1, textarea.input1").focus(function(){
$(this).addClass("input2").removeClass("input1");
}).blur(function(){
$(this).addClass("input1").removeClass("input2");
});
As to why your jQuery isn't working as-is, I'm unsure, I'm afraid; though I suspect it's to do with the selectors.
至于为什么您的 jQuery 不能按原样运行，我不确定，恐怕；虽然我怀疑这与选择器有关。
回答by Blender
Try this code:
试试这个代码：
$("input.input1, textarea.input1").bind('focus blur', function(){
$(this).toggleClass("input2").toggleClass("input1");
});
If it does not work, you might need to use focusoutinstead of blur:
如果它不起作用，您可能需要使用focusout代替blur：
$("input.input1, textarea.input1").bind('focus focusout', function(){
$(this).toggleClass("input2").toggleClass("input1");
});
回答by PeeHaa
You need to use .delegate()if you are on jQuery < 1.7.
.delegate()如果您使用的是 jQuery < 1.7，则需要使用。
And .on()if you are on 1.7 or greater.
而.on()如果你是1.7或更大。
Don't use .live()since it is waaaaay slower.
不要使用，.live()因为它是 waaaaay 慢。
回答by Andzej Maciusovic
Also if your elements loaded with ajax use $(document).on(event,selector,function) , because standart eg. $(selector).click(function() ... will not work
此外，如果您的元素加载了 ajax 使用 $(document).on(event,selector,function) ，因为标准，例如。$(selector).click(function() ... 不起作用
