Question

我想在用户点击

时清除文本字段

<input name="name" type="text" id="input1" size="30" maxlength="1000" value="Enter Postcode or Area" onfocus=="this.value=''" />

Answer 1

除非你正在做一些你想要清除onclick的特定事情，否则我会建议（正如其他人已经注意到的那样）使用onfocus动作。这样，如果有人使用tab进行导航，也会清除默认文本。

您还可以使用onblur检查它是否为空以将其恢复：

 <input type="text" value="Default text" name="yourName" onfocus="if(this.value == 'Default text') { this.value = ''; }" onblur="if(this.value == '') { this.value = 'Default text'; }">

Answer 2

为此，您需要使用脚本语言，可能是javascript。这是一个例子

<input type='text' value'Some text' onclick='javascript: this.value = ""' />

希望这有帮助。

编辑：

为了满足大卫在这里解释的是第二个例子，以防你正在寻找

<script type='javascript'>
    var clear = true;
    function clear(obj)
    {
        if(clear)
        {
            obj.value = '';
            clear = false;
        }
    }
</script>

<input type='text' value'Some text' onfocus='clear(this);' />

Answer 3

使用jQuery库：

<input id="clearme" value="Click me quick!" />

$('#clearme').focus(function() { 
  $(this).val(''); 
});

Answer 4

您可以使用<input ... onfocus="this.value='';"/>。

这样，当获得焦点时，该字段将被清除。但是，如果您只想在用户点击它时清除它（例如，当字段通过键盘获得焦点时），则使用onclick代替onfocus。

但是，正如评论中 David Dorward 所指出的那样，用户可能无法预料到这种行为。因此，请务必在特定字段（例如搜索字段）上设置此功能。

Answer 5

或者您可以简单地使用占位符属性例如.LOGON TDPS/admin_dxwx_p05,store123; .LABEL FIRST CREATE SET TABLE DXWX_P05_DLWORK_DB01.WorKTable_1 ,NO FALLBACK , NO BEFORE JOURNAL, NO AFTER JOURNAL, CHECKSUM = DEFAULT, DEFAULT MERGEBLOCKRATIO ( Customer_Name VARCHAR(25) CHARACTER SET LATIN NOT CASESPECIFIC, Age INTEGER, Product_Name VARCHAR(25) CHARACTER SET LATIN NOT CASESPECIFIC, Price INTEGER) PRIMARY INDEX ( Customer_Name ); .IF ERRORCODE <> 0 THEN .GOTO ERRORFOUND .LABEL SECOND CREATE SET TABLE DXWX_P05_DLWORK_DB01.WorkTable_2 ,NO FALLBACK , NO BEFORE JOURNAL, NO AFTER JOURNAL, CHECKSUM = DEFAULT, DEFAULT MERGEBLOCKRATIO ( Customer_Name VARCHAR(25) CHARACTER SET LATIN NOT CASESPECIFIC, Age INTEGER Product_Name VARCHAR(25) CHARACTER SET LATIN NOT CASESPECIFIC, Price INTEGER) PRIMARY INDEX ( Customer_Name ); .IF ERRORCODE <> 0 THEN .GOTO ERRORFOUND .LABEL THIRD Insert into DXWX_P05_DLWORK_DB01.WorKTable_1 Sel * from DXWX_P05_DLWORK_DB01.Source_Table; .IF ERRORCODE <> 0 THEN .GOTO ERRORFOUND .LABEL FOUR Insert into DXWX_P05_DLWORK_DB01.WorKTable_2 Sel * from DXWX_P05_DLWORK_DB01.WorKTable_1; .IF ERRORCODE <> 0 THEN .GOTO ERRORFOUND .QUIT 0; .label ERRORFOUND .QUIT 8; .LOGOFF; EOF

Answer 6

这是我用于温度转换器/计算器的方式 - 当用户输入（键盘）时，文本输入框使用指定的功能计算;当用户选择其他文本输入（只有两个输入）时，所选的文本输入将清除。

<强> HTML：

<p class="celcius"><h2 style="color:#FFF">Input:</h2>
    <input name="celsius" type="text" class="feedback-input" placeholder="Temperature (Celsius)" onkeyup="Conversion()" onfocus="this.value='';" id="celsius" />
</p>

  <hr>

  <h2 style="color:#FFF">Result:</h2>

<p class="fahrenheit">
    <input name="fahrenheit" type="text" class="feedback-input" id="fahrenheit" onkeyup="Conversion2()" onfocus="this.value='';"placeholder="Temperature (Fahrenheit)" />
  </p>

<强> JavaScript的：

function Conversion() {
    var tempCels = parseFloat(document.getElementById('celsius').value);
      tempFarh =(tempCels)*(1.8)+(32);
      document.getElementById('fahrenheit').value= tempFarh;
 }

function Conversion2() {
    var tempFarh = parseFloat(document.getElementById('fahrenheit').value);
      tempCels =(tempFarh - 32)/(1.8);
      document.getElementById('celsius').value= tempCels;
 }

Answer 7

试试这个，它对我有用

将此添加到输入标记

<code>
onfocus="this.value='';"</code>

例如，如果您的代码是

<code>
<input type="text" value="Name" /></code>

像这样使用

<code><input onfocus="this.value='';" type="text" value="Name" /></code>

Answer 8

function Clear (x) {if (x.cleared) {} else {x.value = ""; x.cleared = true}}

onfocus = "Clear (this)"

Answer 9

将以下脚本添加到您的js文件中：

var input1 = document.getElementById("input1")

input1.onfocus = function() {
  if(input1.value == "Enter Postcode or Area") {
      input1.value = "";
  } 
};

input1.onblur = function() {
    if(input1.value == "") {
       input1.value = "Enter Postcode or Area";
   } 
 };

如何清除文本字段焦点上的文本字段

9 个答案: