如何从 HTML 中的颜色选择器中删除“其他...”选项？
Gre*_*reg 5 html javascript css
如何删除这个“其他...”按钮？
我的 HTML 代码如下： 该代码应该更新
通过从下拉列表中选择颜色来文本。我想限制用户只能使用我列出的颜色。
<body>
<p>An example demonstrating the use of the <code><input type="color"></code>
control.</p>
<label for="colorWell">Color:</label>
<input type="color" value="#ff0000" id="colorWell" list="presetColors">
<datalist id="presetColors">
<option>#ff0000</option>
<option>#00ff00</option>
<option>#0000ff</option>
</datalist>
<p>Watch the paragraph colors change when you adjust the color picker.
As you make changes in the color picker, the first paragraph's
color changes, as a preview (this uses the <code>input</code>
event). When you close the color picker, the <code>change</code>
event fires, and we detect that to change every paragraph to
the selected color.</p>
<script src="scripts.js"></script>
</body>
我的 JavaScript 代码如下：
var colorWell;
var defaultColor = "#0000ff";
window.addEventListener("load", startup, false);
function startup() {
colorWell = document.querySelector("#colorWell");
colorWell.value = defaultColor;
colorWell.addEventListener("input", updateFirst, false);
colorWell.addEventListener("change", updateAll, false);
colorWell.select();
}
function updateFirst(event) {
var p = document.querySelector("p");
console.log(event.target.value);
if (p) {
p.style.color = event.target.value;
}
}
function updateAll(event) {
document.querySelectorAll("p").forEach(function(p) {
p.style.color = event.target.value;
});
}
<label for="colorWell">Color:</label>
<input type="color" value="#ff0000" id="colorWell" list="presetColors">
<datalist id="presetColors">
<option>#ff0000</option>
<option>#00ff00</option>
<option>#0000ff</option>
</datalist>
ari*_*l01 -2
我建议你从源代码中删除，但如果你在源代码中找不到这个按钮，你可以使用javascriptremove()方法删除。
function remove(){
document.getElementById('target').remove();
}<button id="target">Target</button>
<br><br>
<button id="remover" onclick="remove()">Remove Button</button>如果按钮没有id，可以用jquery这样的方法解决：
$(function(){
setInterval(function(){
$('button').each(function(){
var target = $(this);
if(target.text() == 'Other...' || target.val() == 'Other...'){
target.remove();
}
});
}, 300); // 300 ms. you can change time range.
});
如果按钮与文档一起加载一次，则不需要使用 setInterval 方法
| 归档时间： |
|
| 查看次数： |
1580 次 |
| 最近记录： |