我有一个带有加减号的输入字段来提高/降低其中的数字。看起来像这样:
<a onclick="less()">-</a>
<input type="text" text-input">
<a onclick="more()">+</a>
当我单击以提高数字时,如何禁用/防止选择/突出显示 +/- 文本?
我正在寻找一种可以跨浏览器工作的解决方案。谢谢
我有一个带有加减号的输入字段来提高/降低其中的数字。看起来像这样:
<a onclick="less()">-</a>
<input type="text" text-input">
<a onclick="more()">+</a>
当我单击以提高数字时,如何禁用/防止选择/突出显示 +/- 文本?
我正在寻找一种可以跨浏览器工作的解决方案。谢谢
根据您必须支持的浏览器版本,您可以尝试使用 css 属性user-select
来none
. 这里有一个这样的实现示例http://css-tricks.com/almanac/properties/u/user-select/
最好的做法是<button>
这样做。
然后你的高亮问题都解决了,你以更好的方式编写代码。
(您也可以使用 CSS 更改按钮,使它们看起来像您想要的那样)
你可以使用CSS::selection
::selection {
background: none;
}
::-moz-selection {
background: none;
}
::-webkit-selection {
background: none;
}
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="style.css">
<script src="script.js"></script>
<style>
.linklike { color: blue; text-decoration:underline }
</style>
</head>
<body>
<button onclick="less()">-</button>
<input type="text">
<button onclick="more()">+</button>
<br>
<br>
OR<br
<br>
<br>
<span onclick="less()" class="linklike">-</span>
<input type="text">
<span onclick="more()" class="linklike">+</span>
</body>
</html>
快速 plnkr:http ://plnkr.co/edit/u7dKekjLg6DpyUjz1a06?p=preview