Так как pandas 0.22 update доступны варианты сравнения:
и многое другое. Эти функции возвращают логический массив. Посмотрим, как мы можем их использовать:
# sample data
df = pd.DataFrame({'col1': [0, 1, 2,3,4,5], 'col2': [10, 11, 12,13,14,15]})
# get values from col1 greater than or equals to 1
df.loc[df['col1'].ge(1),'col1']
1 1
2 2
3 3
4 4
5 5
# where co11 values is better 0 and 2
df.loc[df['col1'].between(0,2)]
col1 col2
0 0 10
1 1 11
2 2 12
# where col1 > 1
df.loc[df['col1'].gt(1)]
col1 col2
2 2 12
3 3 13
4 4 14
5 5 15
ПРИМЕЧАНИЕ: Используя
stopEventPropagation()
что-то, чего нужно избежать, поскольку это повреждает нормальный поток события в DOM. См. эта статья для получения дополнительной информации. Рассмотрите использование этот метод вместо этого
Присоединение событие щелчка к телу документа, которое закрывает окно. Присоедините отдельное событие щелчка к контейнеру, который останавливает распространение к телу документа.
$(window).click(function() {
//Hide the menus if visible
});
$('#menucontainer').click(function(event){
event.stopPropagation();
});
У меня есть приложение, которое работает так же к примеру Eran, кроме я присоединяю событие щелчка к телу, когда я открываю меню... Отчасти как это:
$('#menucontainer').click(function(event) {
$('html').one('click',function() {
// Hide the menus
});
event.stopPropagation();
});
[еще 114] информация о jQuery one()
функция
Проверьте цель события щелчка окна (она должна распространить к окну, пока она не получена больше нигде), и удостоверьтесь, что это не ни один из элементов меню. Если это не, то Вы вне своего меню.
Или проверка положение щелчка, и видит, содержится ли это в области меню.
The other solutions here didn't work for me so I had to use:
if(!$(event.target).is('#foo'))
{
// hide menu
}
Если вы пишете сценарий для IE и FF 3. * и просто хотите узнать, произошел ли щелчок в определенной области окна, вы также можете использовать что-то вроде:
this.outsideElementClick = function(objEvent, objElement){
var objCurrentElement = objEvent.target || objEvent.srcElement;
var blnInsideX = false;
var blnInsideY = false;
if (objCurrentElement.getBoundingClientRect().left >= objElement.getBoundingClientRect().left && objCurrentElement.getBoundingClientRect().right <= objElement.getBoundingClientRect().right)
blnInsideX = true;
if (objCurrentElement.getBoundingClientRect().top >= objElement.getBoundingClientRect().top && objCurrentElement.getBoundingClientRect().bottom <= objElement.getBoundingClientRect().bottom)
blnInsideY = true;
if (blnInsideX && blnInsideY)
return false;
else
return true;}
$("#menuscontainer").click(function() {
$(this).focus();
});
$("#menuscontainer").blur(function(){
$(this).hide();
});
У меня работает отлично.
Теперь для этого есть плагин: внешние события (запись в блоге)
Когда к элементу привязан обработчик clickoutside (WLOG), происходит следующее:
Таким образом, никакие события не останавливаются от распространения, и дополнительные обработчики click могут быть использованы "над" элементом с обработчиком outside.
Вы можете прослушать событие click на document
и затем убедиться, что #menucontainer
не является предком или целью щелкнутого элемента, используя .closest()
.
Если это не так, то щелкнутый элемент находится за пределами #menucontainer
и его можно безопасно скрыть.
$(document).click(function(event) {
$target = $(event.target);
if(!$target.closest('#menucontainer').length &&
$('#menucontainer').is(":visible")) {
$('#menucontainer').hide();
}
});
Вы также можете произвести очистку после слушателя событий, если вы планируете закрыть меню и хотите перестать слушать события. Эта функция очистит только вновь созданный слушатель, сохранив все остальные слушатели кликов на документе
. С синтаксисом ES2015:
export function hideOnClickOutside(selector) {
const outsideClickListener = (event) => {
$target = $(event.target);
if (!$target.closest(selector).length && $(selector).is(':visible')) {
$(selector).hide();
removeClickListener();
}
}
const removeClickListener = () => {
document.removeEventListener('click', outsideClickListener)
}
document.addEventListener('click', outsideClickListener)
}
Для тех, кто не хочет использовать jQuery. Вот приведенный выше код в обычном vanillaJS (ECMAScript6).
function hideOnClickOutside(element) {
const outsideClickListener = event => {
if (!element.contains(event.target) && isVisible(element)) { // or use: event.target.closest(selector) === null
element.style.display = 'none'
removeClickListener()
}
}
const removeClickListener = () => {
document.removeEventListener('click', outsideClickListener)
}
document.addEventListener('click', outsideClickListener)
}
const isVisible = elem => !!elem && !!( elem.offsetWidth || elem.offsetHeight || elem.getClientRects().length ) // source (2018-03-11): https://github.com/jquery/jquery/blob/master/src/css/hiddenVisibleSelectors.js
ПРИМЕЧАНИЕ:
Это основано на комментарии Алекса о том, чтобы просто использовать !element.contains(event.target)
вместо части jQuery.
Но element.closest()
теперь также доступен во всех основных браузерах (версия W3C немного отличается от jQuery).
Полифиллы можно найти здесь: Element.closest()
Для меня это отлично сработало во времени:
$('body').click(function() {
// Hide the menus if visible.
});
Функция:
$(function() {
$.fn.click_inout = function(clickin_handler, clickout_handler) {
var item = this;
var is_me = false;
item.click(function(event) {
clickin_handler(event);
is_me = true;
});
$(document).click(function(event) {
if (is_me) {
is_me = false;
} else {
clickout_handler(event);
}
});
return this;
}
});
Использование:
this.input = $('<input>')
.click_inout(
function(event) { me.ShowTree(event); },
function() { me.Hide(); }
)
.appendTo(this.node);
А функции очень простые:
ShowTree: function(event) {
this.data_span.show();
}
Hide: function() {
this.data_span.hide();
}