0

我正在尝试制作一个特定的字母：“*”在我正在使用的一行 Javascript 编码中变为红色......以下是我的原件：

function init(){
    var inp = document.getElementsByTagName('input');
    for(var i = 0; i < inp.length; i++) {
        if(inp[i].type == 'text','tel','number', 'email') {
            inp[i].setAttribute('rel',inp[i].defaultValue)
            inp[i].setAttribute('style', 'color: grey;')
            inp[i].onfocus = function() {
                if(this.value == this.getAttribute('rel')) {
                    this.value = '';
                    this.setAttribute('style', 'color: black;')
                } else {
                    return false;
                }
            }

为了使特定字母变红，我会将其更改为吗？

function init(){
    var inp = document.getElementsByTagName('input');
    for(var i = 0; i < inp.length; i++) {
        if(inp[i].type == 'text','tel','number', 'email') {
            inp[i].setAttribute('rel',inp[i].defaultValue)
            inp[i].setAttribute('style', 'color: grey;')
            inp[i].onfocus = function() {
                if(this.value == this.getAttribute('rel')) {
                    this.value = '';
                    this.setAttribute('style', 'color: black;')

                if(this.value == this.getAttribute('*')) {
                    this.setAttribute('style', 'color: red;')

                } else {
                    return false;
                }
            }

我将如何实现这一目标？

谢谢！

4

2 回答 2

2

...因为我真的很无聊，所以我最终使用 javascript 做了你想做的事。

它使用 Mootools，但如果您愿意，它应该为您提供足够的灵感来使用 jQuery 重新创建它。

function reposition() {
    var position = inputEl.getPosition();
    var occludeLabel = inputEl.value;
    occludeLabel = occludeLabel.replace(/\*/g, '<span class="red">*</span>', 'g');
    occludeEl.setStyles({
        top: position.y + 1,
        left: position.x + 1
    });
    occludeEl.set('html', occludeLabel);
}

基本上，每次模糊输入时，都会在输入框上方放置一个包含输入框值的 div，从而遮挡文本。我运行了一个简单.replace()的方法，用一个将其内容变为红色的跨度替换所有星号。

请参阅此 jsfiddle 以获取所有代码：http: //jsfiddle.net/eTEvQ/2/

于 2012-11-04T01:16:56.980 回答
0

您只能设置元素的样式，但不能设置属性的样式。

这条线没有任何意义..

this.value == this.getAttribute('*')

*不是有效的属性名称

这也是问题中的当前输入元素..

您可以为整个输入元素设置颜色，但不能为其中的特定字符设置颜色

于 2012-11-03T21:29:35.827 回答