jQuery 使鼠标指针变成点击按钮的手
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/4628027/
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
Make mouse pointer become hand to click button
提问by slandau
<td id="btnIcOld" style="text-align:center;">
<img src="<%= VirtualPathUtility.ToAbsolute("~/img/chic/Load.png")%>" />
</td>
$('#btnIcOld').live('click', function () {
window.location.href = 'https://extranetint.chathamfinancial.com/indications/swapcalculator';
});
So as you can see above, the image is my button, and that is the JQuery that handles the button click. Problem is, when you hover your mouse over the image, it stays as the basic arrow pointer. How do I make it change to a hand so the user knows they can click on it?
正如您在上面看到的，图像是我的按钮，即处理按钮单击的 JQuery。问题是，当您将鼠标悬停在图像上时，它仍然是基本的箭头指针。如何将其更改为手形以便用户知道他们可以单击它？
回答by Quintin Robinson
You can edit your style for the column to be cursor:pointersee CSS cursor property.
您可以编辑列的样式以cursor:pointer查看CSS 光标属性。
<td id="btnIcOld" style="text-align:center;cursor:pointer;">
<img src="<%= VirtualPathUtility.ToAbsolute("~/img/chic/Load.png")%>" />
</td>
回答by Jonathon Bolster
You can use cursor:pointerin your CSS style. See here for some CSS Cursors
您可以cursor:pointer在您的 CSS 样式中使用。请参阅此处了解一些 CSS 游标
Alternatively, is there no way to wrap it in an atag, pointing to the link you need?
或者，有没有办法将它包装在一个a标签中，指向你需要的链接？
回答by SirDarius
Change the cursor's style when above the image:
在图像上方时更改光标的样式：
<td id="btnIcOld" style="text-align:center;">
<img style="cursor: pointer" src="<%= VirtualPathUtility.ToAbsolute("~/img/chic/Load.png")%>" />
</td>
回答by chprpipr
Everyone is pretty much right, but I would recommend splitting those styles out for maintainability. Try something like this:
每个人都非常正确，但我建议将这些样式拆分为可维护性。尝试这样的事情：
main.css:
主文件：
.txtCenter { text-align:center; }
.clickImage { cursor:pointer; }
ASPX page:
ASPX 页面：
<html>
<head>
...
<link rel="stylesheet" href="path\to\main.css" type="text/css" />
</head>
<body>
...
<td id="btnIcOld" class="txtCenter">
<img class="clickImage" src="<%= VirtualPathUtility.ToAbsolute("~/img/chic/Load.png")%>" />
</td>
...
</body>
</html>
