10

好的，今天我正在制作一个帮助 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？我说的对吗？

希望你明白我的意思。

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

当我没有点击它时。

替代文字

当我点击它时。

替代文字

当我不再点击它时。

替代文字

它应该是

当我没有点击它时。

替代文字

当我点击它时。

替代文字

当我不再点击它时。

替代文字

4

5 回答 5

30

你要这个

<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;
于 2010-07-25T15:27:04.823 回答
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">

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

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 那么您就知道它没有设置，因为它只能返回两个值之一，true 或 false。

编辑：忽略这个答案。目前尚不清楚编辑前的问题是什么。

于 2010-07-25T15:18:56.877 回答
3

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

<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>
于 2010-07-25T15:19:19.733 回答
2

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

<input ... 
onfocus="if (this.value==this.defaultValue) this.value = ''" 
onblur="if (this.value!=this.defaultValue) this.value = this.defaultValue" />
于 2012-03-10T16:27:35.103 回答
0

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

<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...')" />
于 2013-04-22T10:53:51.003 回答