Я хочу, чтобы код JavaScript обнаружил тип курсора.
Например, когда курсор зависает в textarea, он изменяется от значения по умолчанию к тексту.
Я хочу, чтобы код JavaScript обнаружил тип курсора.
Например, когда курсор зависает в textarea, он изменяется от значения по умолчанию к тексту.
Вы можете сделать это, но это не очень, и, вероятно, будет довольно медленным в зависимости от того, сколько элементов у вас на вашей странице.
$('*').mouseenter(function(){
var currentCursor = $(this).css('cursor') ;
//do what you want here, i.e.
console.log( currentCursor );
});
Вы можете определить тип курсора с помощью JavaScript
как
<input id="sample_text" name="one" type="text" value="Sample Text" />
и код JavaScript должен выглядеть примерно так:
$('input[id=sample_text]').click( function() {
alert("test");
var ctl = document.getElementById('sample_text');
var startPos = ctl.selectionStart;
var endPos = ctl.selectionEnd;
alert(startPos + ", " + endPos);
});
вы также можете посмотреть Jsfiddle для обнаружения курсора Js
приведенный выше код Jquery написан, вы также можете использовать Vanilla JS, для которого вам просто нужно изменить его на
<input id="sample_text" name="one" type="text" value="Sample Text" onclick="detect_cursor()" />
и JavaScript должен выглядеть примерно так:
function detect_cursor() {
alert("test");
var ctl = document.getElementById('sample_text');
var startPos = ctl.selectionStart;
var endPos = ctl.selectionEnd;
alert(startPos + ", " + endPos);
};
У меня есть приятное расширение JQuery, идеально подходящее для этого типа вещей в этом контексте:
Чтобы использовать его, просто выполните что-то вроде:
$("#eleID").cursor(); // will return current cursor state for that element
$("#eleID").cursor("pointer"); // will change ele cursor to whatever is ""
$("#eleID").cursor("clear"); // will change ele cursor to default
$("#eleID").cursor("ishover"); // will return boolean of if mouse is over element or not
$("#eleID").cursor("position"); // will return cursor current position in "relation" to element
также
$.cursor("wait") // will change document cursor to whatever is ""
$.cursor($("#eleID"), "wait"); // same as $("#eleID").cursor("wait");
$.cursor("position") // will return current cursor position
также следует упомянуть, если вы отправляете несколько элементов, таких как $("#eleID1, .elementsWiththisClass")
для "position" и "isHover", тогда он возвращает объекты Array
, такие как:
var poses = $("#eleID1, .elementsWiththisClass").cursor("position") // will equal
poses[0] = {
ele: e.fn.e.init[1], // the jquery element
x: XXX, // where XXX is the cursors current position in relation to element
y: XXX
}
poses[1] = { // ...and so on and so forth for each element
Я думаю, вы можете прочитать свойство cursor
css так же, как вы можете его установить, но вы должны сделать это из определенного элемента, потому что AFAIK не может просто прочитать тип курсора из окна или объекта документа. Следуя этой логике, чтобы получить текущий тип курсора, вам нужно будет найти текущий элемент, который находится над мышью, и прочитать его cursor
css. Тем не менее, вам постоянно нужно проверять, изменился ли курсор, который медленный и подвержен ошибкам (как правило, вы почти всегда пытаетесь поместить свой код в обработчик события, чтобы что-то реагировать, а не постоянно проверять, его произошло еще и добавив ваш код в эту функцию более логичным, эффективным, надежным и понятным.)
Но идея обнаружения типа курсора по-прежнему очаровывает меня, и если кто-нибудь знает, как мне хотелось бы услышать об этом.: D
Как альтернативное решение, а не чтение типа курсора, почему бы вам просто не задать обработчик событий, когда он введет элемент, который изменит его? Это было бы намного меньше подверженности ошибкам и, вероятно, более прямолинейным, потому что я не думаю, что вы так много заботитесь о курсоре, но если мышь ввела определенный элемент.
$("#textbox").mouseover( function() {
//I know the cursor has changed because it is now in a textbox
});