HTML 输入 onfocus 和 onblur？

Question

好的，今天我正在制作一个帮助 HTML 函数。它看起来像这样：

function Input($name,$type,$lable,$value= null){
  if (isset($value)) {
    //if (this.value=='search') this.value = ''
    echo '<label for="'. $name .'">'. $lable .'</label><input type="'.$type.'" name="'. $name .'" id="'. $name .'" value="'.$value.'" onfocus="if (this.value==\''.$value.'\') this.value = \'\' "/>';  
  }
  if (!isset($value)) {
    echo '<label for="'. $name .'">'. $lable .'</label><input type="'.$type.'" name="'. $name .'" id="'. $name .'" />'; 
  }
}

如您所见，如果您插入一个值，它会执行一些 JavaScript，这样当我单击框时，框内的文本就会消失，

问题：当我们不在输入时，我们如何使它具有价值？ （请查看stackoverflow上的搜索框，但是stackoverflow上的搜索框在我们不指向输入框后就不会回来？也许是通过使用onblur？我说的对吗？

希望你明白我的意思。

好的，因为你们中的一些人没有明白我的意思 请看

当我没有点击它时。

当我点击它时。

当我不再点击它时。

应该是

当我没有点击它时。

当我点击它时。

当我不再点击它时。

Answer 1

你想要这个

<input ...
onfocus="if (this.value==this.defaultValue) this.value = ''"
onblur="if (this.value=='') this.value = this.defaultValue" />

更新：一些较新的浏览器只需添加占位符属性即可完成您想要的操作：

<input placeholder="Please enter your name" />

这是根据您的代码编写的 PHP

echo <<<END
<label for="$name">$lable</label>
<input type="$type" name="$name" id="$name" value="$value" 
 onfocus="if (this.value==this.defaultValue) this.value = ''" 
 onblur="if (this.value=='') this.value = this.defaultValue"/>
END;

Answer 2

查看此页面的源代码显示以下内容

<form id="search" action="/search" method="get"> 
  <div> 
     <input name="q" class="textbox" tabindex="1" 
     onfocus="if (this.value=='search') this.value = ''" 
     type="text" maxlength="80" size="28" value="search"> 
  </div> 

Answer 3

如果我理解正确，那么 SO 使用这行 HTML 来实现该效果。

<input name="q" class="textbox" tabindex="1" onfocus="if (this.value=='search') this.value = ''" type="text" maxlength="80" size="28" value="search"> 

与您的问题无关，但您可以并且应该将第二个 if 语句替换为 else 语句。

function Input($name,$type,$lable,$value= null){
  if (isset($value)) {
    //if (this.value=='search') this.value = ''
    echo '<label for="'. $name .'">'. $lable .'</label><input type="'.$type.'" name="'. $name .'" id="'. $name .'" value="'.$value.'" onfocus="if (this.value==\''.$value.'\') this.value = \'\' "/>';  
  }
  else {
    echo '<label for="'. $name .'">'. $lable .'</label><input type="'.$type.'" name="'. $name .'" id="'. $name .'" />'; 
  }
}

因为如果 isset($value) 返回 false，那么您就知道它没有设置，因为它只能返回两个值之一，真或假。

编辑：忽略这个答案。在编辑之前不清楚问题是什么。

Answer 4

或者，如果您希望无论输入什么文本都将其更改回默认值...

<input ... 
onfocus="if (this.value==this.defaultValue) this.value = ''" 
onblur="if (this.value!=this.defaultValue) this.value = this.defaultValue" />

Answer 5

试试这个。也许它可以帮助你：

<form action="/search" method="get">
<input type="text" name="q" value="Search..." onfocus="if (this.value == 'Search...') (this.value='')" onblur="if (this.value == '') (this.value='Search...')" />