jquery select 或 select 所有不属于指定 class 的文本输入
jquery selector to select all text inputs not of a specified class
在下面的jquery代码中,我需要跳过一些classname不等于item的输入框
input[type=text][class!=item] , this doesn't works
。如何添加这个例外?
$(document)
.on('focus', 'input[type=text]")', function() {
$('.footer').css('position', 'absolute');
$('.footer').css('bottom', '');
})
.on('blur', 'input[type=text]', function() {
$('.footer').css('position', 'fixed');
$('.footer').css('bottom', '0');
});
您想在查询中使用 :not()
选择器:
查看结果片段:
// 2 solutions here
// Using the class attribute $("input[type=text]:not([class=item])")
console.log($("input[type=text]:not([class=item])").length, "element matched.");
// Using the class selector $("input[type=text]:not('.item')")
console.log($("input[type=text]:not('.item')").length, "element matched.");
// Using the code from your question:
$("input[type=text]:not('.item')").on('focus', function() {
$('.footer').css('position', 'absolute');
$('.footer').css('bottom', '');
})
$("input[type=text]:not('.item')").on('blur', function() {
$('.footer').css('position', 'fixed');
$('.footer').css('bottom', '0');
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" class="item">
<input type="text" class="item">
<input type="text">
我已经在我的代码片段中添加了你的代码,但我不知道你想用你的 .footer
元素做什么。
希望对您有所帮助。
尝试
$("input[type='text']:not('.classname')");
因此,添加和修改您的代码:
$(document)
.on('focus', "input[type='text']:not('.classname')", function() {
$('.footer').css({
'position': 'absolute',
'bottom': 'auto'
});
})
.on('blur', "input[type='text']:not('.classname')", function() {
$('.footer').css({
'position': 'fixed',
'bottom': 0
});
});
在下面的jquery代码中,我需要跳过一些classname不等于item的输入框
input[type=text][class!=item] , this doesn't works
。如何添加这个例外?
$(document)
.on('focus', 'input[type=text]")', function() {
$('.footer').css('position', 'absolute');
$('.footer').css('bottom', '');
})
.on('blur', 'input[type=text]', function() {
$('.footer').css('position', 'fixed');
$('.footer').css('bottom', '0');
});
您想在查询中使用 :not()
选择器:
查看结果片段:
// 2 solutions here
// Using the class attribute $("input[type=text]:not([class=item])")
console.log($("input[type=text]:not([class=item])").length, "element matched.");
// Using the class selector $("input[type=text]:not('.item')")
console.log($("input[type=text]:not('.item')").length, "element matched.");
// Using the code from your question:
$("input[type=text]:not('.item')").on('focus', function() {
$('.footer').css('position', 'absolute');
$('.footer').css('bottom', '');
})
$("input[type=text]:not('.item')").on('blur', function() {
$('.footer').css('position', 'fixed');
$('.footer').css('bottom', '0');
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" class="item">
<input type="text" class="item">
<input type="text">
我已经在我的代码片段中添加了你的代码,但我不知道你想用你的 .footer
元素做什么。
希望对您有所帮助。
尝试
$("input[type='text']:not('.classname')");
因此,添加和修改您的代码:
$(document)
.on('focus', "input[type='text']:not('.classname')", function() {
$('.footer').css({
'position': 'absolute',
'bottom': 'auto'
});
})
.on('blur', "input[type='text']:not('.classname')", function() {
$('.footer').css({
'position': 'fixed',
'bottom': 0
});
});