0

我的网页中有四个输入。要求是当用户填写 1 输入时，其值应填写 3 输入，并且 3 输入颜色应变为红色，与第二个输入相同。但是当我们填充 1 个输入时，4 个输入颜色变为红色。

这是一个示例http://jsfiddle.net/SXzyR/

<head>
<script type="text/javascript" src="jquery-1.7.2.js"></script>    
<script type="text/javascript">

$(function(){       
    $('input').blur(function(){         
        txtval()            
        })      
    })
</script>

<script type="text/javascript">    
function txtval(){      
    document.getElementById('myid3').value = document.getElementById('myid1').value;
    document.getElementById('myid4').value = document.getElementById('myid2').value;

    document.getElementById('myid3').style.color="#ff0000"
    document.getElementById('myid4').style.color="#ff0000"
}
</script>
</head>    
<body>
1
<input type="text" id="myid1" value="Enter name"/>
2
<input type="text" id="myid2" value="Enter name"/>
3
<input type="text" id="myid3" value="Enter name"/>
4
<input type="text" id="myid4" value="Enter name"/>
</body>
4

5 回答 5

1

这是一个简单的解决方案。检查事件触发id的元素的blur，并更新相应的元素value和颜色： 

$('input').blur(function(){
    if (this.id == 'myid1') {
      $('#myid3').css('color', '#FF0000').val(this.value);  
    } else if (this.id == 'myid2') {
      $('#myid4').css('color', '#FF0000').val(this.value);
    }            
})

这是一个小提琴

于 2012-10-17T07:42:25.810 回答
0

因为在所有输入模糊事件上都会调用 txtval() 方法，并且您的方法没有处理任何情况以防止突出显示第二个输入。因此，您的方法中的所有 4 行都已执行，因此第 4 个输入也是彩色的！

这是更新的代码：http: //jsfiddle.net/SXzyR/

$(function(){

$('#myid1').blur(function(){
    $('myid3').value=$(this).value();
    $('#myid3').css('color','#FF0000') 

    });
$('#myid2').blur(function(){
    $('myid3').value=$(this).value();
    $('#myid4').css('color','#FF0000') 
    });

});
于 2012-10-17T07:34:14.983 回答
0

像这样更改您的html代码：

1
<input type="text" id="myid1" value="Enter name" rel="myid3" />
2
<input type="text" id="myid2" value="Enter name" rel="myid4" />
3
<input type="text" id="myid3" value="Enter name"/>
4
<input type="text" id="myid4" value="Enter name"/>

这是js代码

$(function(){

    $('input[rel]').each(function(){
       $(this).blur(function(){
           $("#" + $(this).attr("rel")).val($(this).val()).css('color','#FF0000') ;  
       });        
    });

})

这是示例http://jsfiddle.net/SXzyR/2/

于 2012-10-17T07:36:31.783 回答
0

那是因为你已经添加了事件处理程序，input应该在任何/所有的事件上调用.. 你可以做的是$('input')textval()blurinputs

1) 传递参数来textval()指定要变红的那个。2）您可以将事件处理程序附加到特定input以指定input需要变为红色的另一个...

于 2012-10-17T07:38:23.360 回答
-2

检查这个jsFiddle ...

http://jsfiddle.net/SXzyR/8/

问题是因为您的模糊功能适用于所有输入元素.....

修改了一些代码，因此您不必更改或添加任何属性..只需要检查条件

于 2012-10-17T07:40:04.460 回答