1

我在让我的onFocus和onBlur事件正常工作时遇到了一些问题

这是我得到的

var var1

$("input").focus(function() {

  var1 = $(this).val()

if ( $(this).val()==var1) {
       $(this).val('').css({'color': "#000", 'font-style': 'normal', 'font-weight': 'bold'});
   }  
    $(this).css({'background-color':'#d7df23' });    
});

$("input").blur(function() {
   if ( $(this).attr("value")=="") {
       $(this).val(var1).css({'color': "#666", 'font-style': 'italic', 'font-weight': 'normal'});
   }   
    $(this).css({'background-color':'#EEEEEE' });      
});

这是我的 HTML

<input type="text" id="tbTitle" value="Title">

<input type="text" id="tbTitle1" value="Title1">

<input type="text" id="tbTitle2" value="Title2">

如果您不更改文本框的值，则此方法有效。

基本上我想获取输入的原始值并将其存储在 var 中，然后如果该字段为空白，则将原始值放回原处。

目前它将文本框中的任何内容的值放在焦点上

有没有办法存储原始值并仅将其更改为该值onBlur？

这是我的jsfiddle的链接

4

5 回答 5

5

这是我的解决方案...

http://jsfiddle.net/Sohnee/YTTD5/4/

或者在代码中...

var originalValues = new Array();

$("input").focus(function() {

    if (!originalValues[this.id]) {
      originalValues[this.id] = $(this).val()
    }

    if ( $(this).val()==originalValues[this.id]) {
           $(this).val('').css({'color': "#000", 'font-style': 'normal', 'font-weight': 'bold'});
       }  
        $(this).css({'background-color':'#d7df23' });    
   });

    $("input").blur(function() {
       if ( $(this).attr("value")=="") {
           $(this).val(originalValues[this.id]).css({'color': "#666", 'font-style': 'italic', 'font-weight': 'normal'});
       }   
        $(this).css({'background-color':'#EEEEEE' });      
   });
于 2011-01-28T13:20:17.303 回答
0

您正在使用单个var1但多个文本框。因此，var1当您离开一个文本框时，您进入另一个文本框会受到打击。此外，您在var1测试元素的值之前分配给它，因此==永远是正确的。

要“获取输入的原始值并将其存储在 var 中，然后如果该字段为空白，则将原始值放回原处”，您可以执行以下操作：

var values = {};

$("input").focus(function() {

    var $this = $(this);

    // Save the value on focus
    values[this.id] = $this.val();

}).blur(function() {

    var $this = $(this);

    // Restore it on blur
    if ($this.val() == "") {
        $this.val(values[this.id]);
    }

});

我忽略了上面的 CSS 内容，因为我不太清楚你想用它做什么。添加回来很容易。

于 2011-01-28T13:15:17.797 回答
0

尝试设置var var1 = null;初始值，然后当焦点触发第一次设置它时var1 = var1 ?? $(this).val();，就像你每次都覆盖值一样，也可能需要考虑将原始值存储为实际对象上的数据而不是全局变量

于 2011-01-28T13:19:26.413 回答
0

没有CS的东西..如果我们输入一个字段，该字段的值在'rel'属性中支持该值。在字段退出时，如果值为空，则复制 rel 属性中可能存在的任何内容，该属性要么什么都没有，要么是初始焦点上存在的值。

$("input").focus(function() {
 if($(this).val()!=''){
  $(this).attr('rel',$(this).val());
 }
});

$("input").blur(function() {
 if($(this).val()==''){
  $(this).val($(this).attr('rel'));
 }
});
于 2011-01-28T13:21:36.547 回答
0

您的问题是您在聚焦时存储输入值，而不是在初始设置时存储输入值。这段代码可能有用：

var initials ={};
$(document).ready(function(){
  $('input').each(function(){
    initials[this.id] = $(this).attr('value');
  });
});

$('input').focus(function(){
  // do whatever you want to
});

$('input').blur(function(){
  if($(this).attr('value')==''){
    $(this).attr('value', initials[this.id]);
  }
  // do other stuff
});
于 2011-01-28T13:56:13.987 回答