堆棧內存溢出
  簡體   English   中英

清除輸入的特定表單值？

[英]Clear input for a specific form value?

 原文  2017-02-11 07:21:07  7   2    javascript/ php

問題描述

我想為輸入類型上的特定值設置一個清除/重置按鈕。 我試圖為此創建一個js函數，但是該函數清除了輸入類型的所有值。 這是我的html： 

<div id="wrapper-body">
    <div id="kiri" class="btn btn-default">

    <div id="kiri1">
    <div class="btn btn-default">
        <form action="../php/termo_i.php" id="form_input" method="post">
        <table border=0>
         <tr>
                <td width=70>Tanggal</td>
                <td width=10>:</td>
                <td width=30>
                <input type="text"  id="datepicker" type="text" name="datepicker" size=26> </td>
                <td width=1>
               <input type="text" id="t1" name="t1" maxlength="5" size=1 disabled="disabled" style="visibility:hidden"> 
                 </td>
            </tr>
             <tr>
                <td width=70>Silo</td>
                <td width=10>:</td>
                <td width=30>

    <select name="silo" onchange="updateField(this.name, this.value)">
      <option>-</option>
      <option value="Silo 1">Silo 1</option>
      <option value="Silo 2">Silo 2</option>
      <option value="Silo 3">Silo 3</option>
      <option value="Silo 4">Silo 4</option>
      <option value="Silo 5">Silo 5</option>
      <option value="Silo 6">Silo 6</option>
      <option value="Silo 7">Silo 7</option>
      <option value="Silo 8">Silo 8</option>
      <option value="Silo 9">Silo 9</option>
      <option value="Silo 10">Silo 10</option>
      <option value="Silo 11">Silo 11</option>
      <option value="Silo 12">Silo 12</option>
      <option value="Silo 13">Silo 13</option>
      <option value="Silo 14">Silo 14</option>
      <option value="Silo 15">Silo 15</option>
      <option value="Silo 16">Silo 16</option>
    </select>
 <input type="text" name="silo" size="16" readonly="readonly" id="silo">
</td>
<td width=1>
               <input type="text" id="S1" name="S1" maxlength="5" size=1 disabled="disabled" style="visibility:hidden"> 
                 </td>
            </tr>
            <tr>
                <td width=70>Sensor 1</td>
                <td width=10>:</td>
                <td width=30>
                <input type="text" id="s1" type="text" name="s1" maxlength="5" size=26 onkeyup="check();"> </td>
               <td width=1>
               <input type="text" id="l1" name="l1" maxlength="5" size=1 disabled="disabled" style="visibility:hidden"> 
                 </td>
            </tr>
             <tr>
                <td width=70>Sensor 2</td>
                <td width=10>:</td>
                <td width=30>
                <input type="text" id="s2" type="text" name="s2" maxlength="5" size=26 onkeyup="check1();"> </td>
                <td width=1>
                <input type="text" id="l2" name="l2" maxlength="5" size=1 disabled="disabled" style="visibility:hidden"> 
                 </td>
            </tr>
             <tr>
                <td width=70>Sensor 3</td>
                <td width=10>:</td>
                <td width=30>
                <input type="text" id="s3" type="text" name="s3" maxlength="5" size=26 onkeyup="check2();"> </td>
                <td width=1>
                <input type="text" id="l3" name="l3" maxlength="5" size=1 disabled="disabled" style="visibility:hidden"> 
                 </td>
            </tr>
             <tr>
                <td width=70>Sensor 4</td>
                <td width=10>:</td>
                <td width=30>
                <input type="text" id="s4"type="text" name="s4" maxlength="5" size=26 onkeyup="check3();"> </td>
                <td width=1>
                <input type="text" id="l4" name="l4" maxlength="5" size=1 disabled="disabled" style="visibility:hidden"> 
                 </td>
            </tr>
             <tr>
                <td width=70>Sensor 5</td>
                <td width=10>:</td>
                <td width=30>
                <input type="text" id="s5" type="text" name="s5" maxlength="5" size=26 onkeyup="check4();"> </td>
                <td width=1>
                <input type="text" id="l5" name="l5" maxlength="5" size=1 disabled="disabled" style="visibility:hidden"> 
                 </td>
            </tr> <tr>
                <td width=70>Sensor 6</td>
                <td width=10>:</td>
                <td width=30>
                <input type="text" id="s6" type="text" name="s6" maxlength="5" size=26 onkeyup="check5();"> </td>
                <td width=1>
                <input type="text" id="l6" name="l6" maxlength="5" size=1 disabled="disabled" style="visibility:hidden"> 
                 </td>
            </tr> <tr>
                <td width=70>Sensor 7</td>
                <td width=10>:</td>
                <td width=30>
                <input type="text" id="s7" type="text" name="s7" maxlength="5" size=26 onkeyup="check6();"> </td>
                <td width=1>
               <input type="text" id="l7" name="l7" maxlength="5" size=1 disabled="disabled" style="visibility:hidden"> 
                 </td>
            </tr>
             <tr>
                <td width=70>Sensor 8</td>
                <td width=10>:</td>
                <td width=30>
                <input type="text" id="s8" type="text" name="s8" maxlength="5" size=26 onkeyup="check7();"> </td>
                <td width=1>
               <input type="text" id="l8" name="l8"  maxlength="5" size=1 disabled="disabled" style="visibility:hidden"> 
                 </td>
            </tr> <tr>
                <td width=70>Sensor 9</td>
                <td width=10>:</td>
                <td width=30>
                <input type="text" id="s9" type="text" name="s9" maxlength="5" size=26 onkeyup="check8();"> </td>
                <td width=1>
               <input type="text" id="l9" name="l9"  maxlength="5" size=1 disabled="disabled" style="visibility:hidden"> 
                 </td>
            </tr> <tr>
                <td width=70>Sensor 10</td>
                <td width=10>:</td>
                <td width=30>
                <input type="text" id="s10" type="text" name="s10" maxlength="5" size=26 onkeyup="check9();"> </td>
                <td width=1>
               <input type="text" id="l10" name="l10"  maxlength="5" size=1 disabled="disabled" style="visibility:hidden"> 
                 </td>
            </tr>
             <tr>
                <td width=70>Sensor 11</td>
                <td width=10>:</td>
                <td width=30>
                <input type="text" id="s11" type="text" name="s11" maxlength="5" size=26 onkeyup="check10();"> </td>
                <td width=1>
               <input type="text" id="l11" name="l11" maxlength="5" size=1 disabled="disabled" style="visibility:hidden"> 
                 </td>
            </tr>
             <tr>
                <td width=70>Sensor 12</td>
                <td width=10>:</td>
                <td width=30>
                <input type="text" id="s12" type="text" name="s12" maxlength="5" size=26 onkeypress="check11();onPress_ENTER();"> </td>
                <td width=1>
               <input type="text" id="l12" name="l12"  maxlength="5" size=1 disabled="disabled" style="visibility:hidden"> 
                 </td>
            </tr>
             <tr>
                <td width=70>Ambien</td>
                <td width=10>:</td>
                <td width=30>
                <input type="text" id="amb" name="amb" value="35.0" readonly="readonly" type="text" size=26> </td>
                <td width=1>
               <input type="text" id="amb1" name="amb1" maxlength="5" size=1 disabled="disabled"style="visibility:hidden"> 
                 </td>
            </tr>
            <tr>
                <td width=70>Average</td>
                <td width=10>:</td>
                <td width=30>
                <input type="text" id="avr" name="avr" type="text" size=26 readonly="readonly"> </td>
                <td width=1>
               <input type="text" id="avr1" name="avr1" maxlength="5" size=1 disabled="disabled" style="visibility:hidden"> 
                 </td>
            </tr>
            <tr>
                <td width=70>Defiasi</td>
                <td width=10>:</td>
                <td width=30>
                <input type="text" id="deff" name="deff" type="text" size=26 readonly="readonly"> </td>
                <td width=1>
               <input type="text" id="deff1" name="deff1" maxlength="5" size=1 disabled="disabled" style="visibility:hidden"> 
                 </td>
            </tr>
            <tr>
                <td width=70>Status</td>
                <td width=10>:</td>
                <td width=30>
                <input type="text" id="sts" name="sts" type="text" size=26 readonly="readonly"> </td>
                <td width=1>
               <input type="text" id="st1" name="st1" maxlength="5" size=1 disabled="disabled" style="visibility:hidden"> 
                 </td>
            </tr>
            <tr>
                <td width=70></td>
                <td width=10></td>
                <td width=30>
                 <input class="btn btn-default" type="button" value="Ok" name="ok" id="ok"
                 <span id="result"></span> 
                 <input class="btn btn-default" type="button" value="Reset" name="reset" id="reset" > 
                 <input class="btn btn-default" type="button" value="Save" name="save">
                 <input class="btn btn-default" type="button" value="Delete" name="delete">
                 </td>
                <td width=1>
               <input class="btn btn-default" type="button" value="Print" name="print"> 
                 </td>
            </tr>

    </table>
    </form>
    </div>
    </div>
    <div id="btn btn-default" style="padding-left:350px">


    <input class="btn btn-default" type="button" value="Edit" name="edit">




    </div>
    </div>
</div>

這是我的js函數： 

// JavaScript Document
$("#ok").click( function() {
 $.post( $("#form_input").attr("action"),
         $("#form_input :input").serializeArray(),
         function(info){ $("#result").html(info);
   });
clearInput();
});

$("#form_input").submit( function() {
  return false;
});
function clearInput() {
    $("#form_input :input").each( function() {
       $(this).val('');
    });
}

我試圖$(this).val('') with document.getElementById('silo').value('');更改$(this).val('') with document.getElementById('silo').value(''); 它沒有用。 我自己解決不了這個問題。

2 個解決方案

解決方案1
 0  2017-02-11 07:24:57

 function clearInput() { var a=document.querySelectorAll("#form_input :input"); for(var i=0; i<a.length; i++){ a.value=""; } }

解決方案2
 0  2017-02-11 09:25:56

對於每個特定的輸入，添加一個類cls clearInput()如下所示更改您的clearInput()函數 

function clearInput() { 
         $("#form_input .cls").each( function(){
                   $(this).val(''); 
          });
}

暫無
暫無

聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

相關問題 克隆表單輸入和清除值 javascript清除復選框上的輸入表單值 jQuery在單擊時清除多個輸入文件的特定值 將表單輸入值設置為“”不會清除空格 在Chrome中重新加載頁面后清除表單輸入值 清除輸入值，然后聚焦 清除輸入值的按鈕 清除輸入值Javascript 使用 jQuery 清除特定的輸入字段 清除表單提交上的輸入字段
相關標簽
 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM