javascript 检测光标类型

detect cursor type

提问by mkotwd

I want JavaScript code to detect the cursor type.

我想要 JavaScript 代码来检测光标类型。

For example when the cursor hovers in textarea it changes from default to text ..

例如，当光标悬停在 textarea 时，它会从默认更改为 text ..

回答by P4ul

You could do this, but its not pretty, and will probably be quite slow depending on how many elements you have on your page.

您可以这样做，但它并不漂亮，并且可能会很慢，具体取决于您的页面上有多少元素。

$('*').mouseenter(function(){
    var currentCursor = $(this).css('cursor') ;

    //do what you want here, i.e.
    console.log( currentCursor );
});

回答by Chitrank Dixit

You can detect the cursor type using JavaScript

您可以使用 JavaScript 检测光标类型

like

喜欢

<input id="sample_text" name="one" type="text" value="Sample Text" />

and the JavaScript code should look something like this

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);
});

you can also look at this Jsfiddle for Js Cursor Detection

你也可以看看这个Jsfiddle for Js Cursor Detection

the above is the Jquery code written , you can also use the Vanilla JS for that you just need to change it to

以上是编写的Jquery代码，您也可以使用Vanilla JS，只需将其更改为

<input id="sample_text" name="one" type="text" value="Sample Text" onclick="detect_cursor()" />

and the JavaScript should look something like this

JavaScript 应该看起来像这样

function detect_cursor() {
   alert("test");   
   var ctl = document.getElementById('sample_text');
   var startPos = ctl.selectionStart;
   var endPos = ctl.selectionEnd;
   alert(startPos + ", " + endPos);
};

回答by SpYk3HH

I have a nice jQuery Extension perfect for this type of thing at this gist:

在这个要点上，我有一个很好的 jQuery 扩展，非常适合这种类型的事情：

https://gist.github.com/2206057

https://gist.github.com/2206057

To use it just do something like:

要使用它，只需执行以下操作：

$("#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's current position in "relation" to element

also

还

$.cursor("wait") // will change document cursor to whatever is ""
$.cursor($("#eleID"), "wait"); // same as $("#eleID").cursor("wait");
$.cursor("position") // will return current cursor position

should also mention, if you submit multiple elements like $("#eleID1, .elementsWiththisClass")for "position" and "isHover" then it will return an Arraycontaining objects like:

还应该提到，如果您提交多个元素，例如$("#eleID1, .elementsWiththisClass")“位置”和“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

回答by Gordon Gustafson

I think you can read the cursorcss property just like you can set it, but you have to do this from a specific element because AFAIK there's no way to just read the cursor type from the window or document object. Following this logic, to get the current cursor type you would have to find the current element the mouse is over and read its cursorcss. However, you'd constantly have to check to see if the cursor changed, which is slow and error prone (As a rule you should almost always try to try to put your code in an event handler to react to something instead of constantly checking if its happened yet and putting your code in that function its more logical, efficient, robust, and clear.)

我认为您可以cursor像设置它一样读取css 属性，但是您必须从特定元素执行此操作，因为 AFAIK 无法仅从窗口或文档对象读取光标类型。按照此逻辑，要获取当前光标类型，您必须找到鼠标悬停的当前元素并读取其cursorcss。但是，您必须经常检查光标是否发生变化，这很慢且容易出错（作为一项规则，您几乎应该总是尝试将代码放入事件处理程序中以对某些事情做出反应，而不是不断检查它发生了，并将您的代码放入该函数中，它更合乎逻辑、更高效、更健壮且更清晰。）

But the idea of detecting the cursor type still fascinates me, and if anyone knows how I'd love to hear about it. :D

但是检测光标类型的想法仍然让我着迷，如果有人知道我很乐意听到它。:D

---

---

As an alternate solution, rather than reading the cursor type, why don't you just set an event handler for when it enters an element that would change it? This would be a lot less error prone and probably more direct, because I don't think you care so much about the cursor, but if the mouse has entered a specific element.

作为替代解决方案，与其读取光标类型，不如为它进入会更改它的元素时设置一个事件处理程序？这将更不容易出错并且可能更直接，因为我认为您不太关心光标，但如果鼠标已进入特定元素。

$("#textbox").mouseover( function() { 
    //I know the cursor has changed because it is now in a textbox
});