1

我是 html 和 javascript 的新手。我一直在尝试使用 javascript 修改输入元素的值。目的是在用户单击该字段时将其设置为空白。代码如下：

<html>
<head>
<script>
function fn(){
if(document.input1.value=="name")
document.input1.value="";
}</script></head>
<body>
<input name="input1" type="text" value="name" onClick="fn()"/>
</body></html>

但是，此代码不起作用。我正在使用 chrome 浏览器。当我用表单标签包围输入标签并在脚本中使用document.form.input1.value代码时。哪里有问题？我不关心如何在用户单击时空白字段，而是如何从函数访问值。提前致谢。

4

6 回答 6

1

这会更好（使用placeholder）：

<html>
  <body>
    <input name="input1" type="text" placeholder="name" />​
  </body>
</html>

这是不言自明的。如果您需要解释，请告诉我。

于 2012-09-20T12:32:14.837 回答
1

或者一种替代方法可能只是使用“占位符”属性，它不需要任何额外的 javascript。见我的 jsfiddle

唯一的区别是文本会在输入新文本时消失，而不是在单击时消失。好处是占位符文本将在清除该字段时自动再次返回。

于 2012-09-20T12:33:27.693 回答
1

您可能还想尝试onFocus和onBlur事件：

<html>
  <head>
   <script>
     function fn(){
       if(document.getElementById("input1").value=="name")
         document.getElementById("input1").value="";
     }
     function fn2(){
       if(document.getElementById("input1").value=="")
         document.getElementById("input1").value="name";
     }
    </script>
  </head>
  <body>
   <input id="input1" name="input1" type="text" value="name" onFocus="fn();" onBlur="fn2();"/>
  </body>
</html>​

例子

编辑：

如果您更喜欢按名称获取元素，则可以使用document.getElementsByName，但是，这会返回所有匹配元素的列表，然后您会将其视为匹配元素的数组。在上述情况下，您将document.getElementById("input1")使用document.getElementsByName("input1")[0]

于 2012-09-20T12:40:15.193 回答
0 
<html>
<head>
<script>
function fn(){
if(document.getElementById("input1").value=="name")
document.getElementById("input1").value="";
}</script>
</head>
<body>
<input id="input1" type="text" value="name" onClick="fn()"/>
</body>
</html>
于 2012-09-20T12:38:06.580 回答
0

你听说过 Jquery 吗？这是一个 javascript 库，可以简化您的工作！

从 jquery 网站下载 jquery 并将其包含到您的项目中

<script type="text/javascript" src="[[jquery file.js]]"></script>

然后你可以使用：

<script>
    $("#[[yourinputid]]").click(
    function()
    {
    if ($(this).val() == "name")
       $(this).val("")
    });
</script>

jquery = 简单的 javascript ;)

于 2012-09-20T12:38:34.837 回答
0

或者，您可以将整个输入元素传递到您创建的 javascript 函数中，然后对其进行操作，注意整个元素是如何通过“onClick =”fn(this)" 传递的，这意味着元素本身。通过将元素包含在表单中标签，我相信让您能够按名称调用元素，因为在单个文档中允许重复名称，然后可以在多个表单实例中隔离。

<html>
<head>
<script >
function fn(obj)
{    
if(obj.value=="name")
obj.value="";
}
</script>
</head>
<body>
<input name="input1" type="text" value="name" onClick="fn(this)"/>
</body></html>
于 2012-09-20T13:04:25.457 回答