Question

我正在尝试使用javascript创建文本框水印但是使用当前代码我收到错误

网页错误详情消息：'searchInput'未定义

<script type="text/javascript" language="javascript">

function watermark(inputId,text){ 

  var inputBox = document.getElementById(searchInput); 

      if (inputBox.value.length > 0){  

           if (inputBox.value == text)  

                  inputBox.value = '';
  }   
    else   
       inputBox.value = text;
 }
</script>

<input name="keyword2" id="searchInput" type="text" class="searchbox2"
       value="Enter a State, County, City or Zip" size="77" maxlength="30"
       onfocus="watermark('searchInput','Enter a State, County, City or Zip');"
       onblur="watermark('searchInput','Enter a State, County, City or Zip');"/>

Answer 1

您的函数所期望的变量名为inputId而不是searchInput ..

所以改变这一行

var inputBox = document.getElementById(searchInput);

到

var inputBox = document.getElementById(inputId);

替代

为避免完全命名元素，只需传递this作为第一个参数，因为它将引用元素

function watermark(element, text) {
    if (element.value.length > 0) {
        if (element.value == text) {
            element.value = '';
        }
    }
    else element.value = text;
}

和

<input name="keyword2" id="searchInput" type="text" class="searchbox2"
       value="Enter a State, County, City or Zip" size="77" maxlength="30"
       onfocus="watermark(this,'Enter a State, County, City or Zip');"
       onblur="watermark(this,'Enter a State, County, City or Zip');"/>

演示http://jsfiddle.net/ZtutT/

Answer 2

在searchInput周围添加引号。

getElementById接受一个字符串，您正在引用一个未声明的变量。

document.getElementById('searchInput');

Answer 3

您需要在搜索输入getElementById声明周围加上引号，如下所示：

document.getElementById('searchInput');

此外，更直接，更简单的方法是将其放入输入中：

onfocus="if(this.value==this.defaultValue)this.value='';" onblur="if(this.value=='')this.value=this.defaultValue;"

希望这会有所帮助：）

添加Javascript文本水印不起作用

3 个答案: