用Javascript清除表单字段点击

对不起，提前提出新问题！我正在Javascript中制作计算器应用程序，并且很难获取“C”（清除）按钮来清除该字段。编辑：澄清，清除按钮不仅应该清除领域，而且还包括在内存中的一切，以便我可以开始一个新的计算。 <input type="reset" value="C"/>清除该字段，但保留我在内存中按下的最后一个按钮。用Javascript清除表单字段点击

<script> 
     input = ""; 

     function handleClick(data) { 

     input += data; 
     document.getElementById("output").value = input; 
     console.log(input); 
     } 

     function evaluateExpression(data) { 
     input = document.getElementById("output").value = eval(input); 
     } 

     function clear(data) { 
     input = data; 
     input = document.getElementById("output").reset(); 
     console.log(input); 
     } 

    </script> 

    <div id="calculator"> 

     <form> 
     <input type="text" id="output" /> 
     </form> 

     <button onclick="handleClick(1)">1</button> 
     <button onclick="handleClick(2)">2</button> 
     <button onclick="handleClick(3)">3</button> 
     <button onclick="handleClick(4)">4</button> 
     <button onclick="handleClick(5)">5</button> 
     <button onclick="handleClick(6)">6</button> 
     <button onclick="handleClick(7)">7</button> 
     <button onclick="handleClick(8)">8</button> 
     <button onclick="handleClick(9)">9</button> 
     <button onclick="clear(0)">C</button> 
     <button onclick="handleClick('+')">+</button> 
     <button onclick="handleClick('-')">-</button> 
     <button onclick="handleClick('/')">/</button> 
     <button onclick="handleClick('*')">*</button> 
     <button onclick="evaluateExpression()">=</button> 
    </div>

“清除”功能只是不想工作。我哪里错了？

来源

2013-04-24 jenno

http://stackoverflow.com/cn – Xotic750 2013-05-11 10:06:51

为什么不只是使用内置的reset类型？

<input type="reset" value="C"/>

这将不得不在<form>之内。

来源

2013-04-24 17:38:43 nullability

耶稣我感觉很厚。这是完美的。谢谢！ – jenno 2013-04-24 18:07:49

嗯，经过测试，虽然清除了字段，但它并不清楚javascript内存中的内容。清除后，当我按“7”例如，它将保持我按下的最后一个动作（在我的情况下“+”），然后加7。例如，我做了2 + 2这给了我4.然后我按清除，按7然后它给我11. – jenno 2013-04-24 18:10:58

它不会工作，如果形式包含像这样的字段：重置表单后，它仍然会在文本字段中包含“abc”... – Pran 2015-10-01 21:09:42

重置表单。 link

document.getElementById("frm").reset();

或设置文本框的这样

document.getElementById('output').value = "";

来源

2013-04-24 17:40:19 NullPointerException

document.getElementById（“form”）。reset（）;给我一个错误：“未捕获TypeError：无法调用方法'重置'为null” – jenno 2013-04-28 17:18:55

while'document.getElementById（'output'）。value =“”;'请清除该字段，当我按下一个数字时，它会将下一个数字追加到我刚刚清除的数字上。例如：按4然后C.字段清除。按2. 42出现。 – jenno 2013-04-28 17:21:58

值可你不只是一组输出为空字符串的文本？

（或）

更有可能，如果你做一个计算器将它设置为0？

document.getElementById("output").value = 0;

来源

2013-04-24 17:41:04 CosmicChild

这里是清除上jsfiddle

输入字段

<input id="entry" type="text"></input> 
<button id="clear">Clear</button> 

var entry = document.getElementById("entry"), 
    clear = document.getElementById("clear"); 

function clearfield() { 
    // EDIT: place code for clearing anything else that would be affected here 
    entry.value = ""; 
} 

clear.addEventListener("click", clearfield, false);

的值的一个例子，这里是jsfiddle

使用 form.reset

<form id="myForm"> 
    <input id="entry" type="text"></input> 
</form> 
<button id="clear">Clear</button> 

var clear = document.getElementById("clear"), 
    form = document.getElementById("myForm"); 

function clearfield() { 
    // EDIT: place code for clearing anything else that would be affected here 
    form.reset(); 
} 

clear.addEventListener("click", clearfield, false);

的一个例子

另外，内联JavaScript被认为是不好的做法，你应该考虑一种方法，如addEventListener。

即onclick="doit();"

Why use addEventListener?

addEventListener is the way to register an event listener as specified in W3C DOM. Its benefits are as follows:

It allows adding more than a single handler for an event. This is particularly useful for DHTML libraries or Mozilla extensions that need to work well even if other libraries/extensions are used. It gives you finer-grained control of the phase when the listener gets activated (capturing vs. bubbling) It works on any DOM element, not just HTML elements.

来源

2013-04-24 17:43:22 Xotic750

关于c点击按钮，清除产值

document.getElementById('output').value = "";

来源

2013-04-24 17:44:29

你试图做this.?

那就试试这个代码，

function clear(data) { 
     document.getElementById("output").value=data; 
     }

来源

2013-04-24 17:45:12

谢谢你..它的作品.. – 2016-12-15 13:59:32

@PradeepKumarPrabaharan很高兴帮助PPK！ :) – 2016-12-15 14:30:46

$(function(){ 
    $("input").click(function(){ 
     if(this.value == 0) 
     { 
      this.value=''; 
      return; 
     } 
     else 
     { 
      return; 
     } 
    }); 
});

将“输入”设置为#YourFieldId，并摆脱if内部，但保留this.value ='';

这是最好的方式来清除点击字段，如果你可以使用jQuery的... ...

您也可以始终有一个条件来检查输入，然后像上面的代码清除清除其中具有'0'的输入字段。

来源

2013-07-02 22:21:14

用Javascript清除表单字段点击

回答

相关问题