0

我有一个使用默认颜色加载的颜色选择器字段，然后访问者可以使用色轮或仅通过更改文本来更改输入值。我有 javascript 获取颜色选择器的值并将其旁边的链接 href 设置为该值。

问题是，当页面加载时，链接按钮在颜色选择器中设置为默认值，但是当访问者更改此值时，链接 href 不会更改以反映这一点而无需刷新。

这是现场直播：http ://www.brainbuzzmedia.com/themes/vertex/

这是我拥有的javascript：

<script type="text/javascript">
$(document).ready(function(){

var a = document.getElementById('colorLink');
var color = document.getElementById('color-demo').value;
a.href = "http://www.brainbuzzmedia.com/themes/vertex/?color=" + color;

});
</script>

这是添加颜色选择器输入和链接的 html：

<input type="text" name="color-demo" id="color-demo" value="#ff0000" class="colorfield regular-text" data-hex="true" onChange="refresh()"/><a href="" id="colorLink">LINK</
4

3 回答 3

2

每当值更改时执行该代码

$("#color-demo").change(function() {
    var a = document.getElementById('colorLink');
    var color = document.getElementById('color-demo').value;
    a.href = "http://www.brainbuzzmedia.com/themes/vertex/?color=" + color;
});
于 2012-06-24T05:07:34.477 回答
0

document.getElementById("color-demo").onblur = function() {
var a = document.getElementById('colorLink');
var color = document.getElementById('color-demo').value;
a.href = "http://www.brainbuzzmedia.com/themes/vertex/?color=" + 颜色;
}

或这样做：

<input type="text" name="color-demo" id="color-demo" value="#ff0000" class="colorfield regular-text" data-hex="true" onchange="Refresh(this.value)"/>

函数刷新（颜色）{
var a = document.getElementById('colorLink');
a.href = "http://www.brainbuzzmedia.com/themes/vertex/?color=" + 颜色;
}

于 2012-06-24T05:07:01.017 回答
0

尝试在文本框的 KeyUp、KeyDown 和 Blur 事件上设置值.. 像这样..

$("#color-demo").bind("keyup keydown blur",{},function() {
    var a = document.getElementById('colorLink');
    var color = document.getElementById('color-demo').value;
    a.href = "http://www.brainbuzzmedia.com/themes/vertex/?color=" + color;
});
于 2012-06-24T05:16:51.060 回答