克隆後無法將輸入值設置爲空白

我被卡住了。下面的腳本工作正常克隆整個div選項卡與多個輸入屬性，但問題是我無法重置/或將值設置爲空或空。請幫忙。克隆後無法將輸入值設置爲空白

<html> 
<head> 
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.4.3.min.js"></script> 
    <script type="text/javascript"> 
    $(document).ready(function() { 

     var inputs = 1; 

     $('#btnAdd').click(function(e) { 
      e.preventDefault(); 
      alert("asfter priovent defaulg"); 

      $('.btnDel:disabled').removeAttr('disabled'); 
      var c = $('.clonedInput:last').clone(true); 

      $.each(c.find(':input'), function (i, val) { 
        var suffix = $(this).attr('name').match(/\d+/); 
        var oldN = $(this).attr('name'); 

        var newN = oldN.replace('[' + suffix + ']', '[' + (parseInt(suffix) + 1) + ']'); 

        $(this).attr('name', newN);  
        $(this).find('input').val('').end(); 

        c.children(':text').attr('name', newN); 
        c.children(':text').attr('name', newN).val('').end(); 
      }); 
      $('.clonedInput:last').after(c); 
     }); 
    }); 
    </script> 
</head> 

<form id="myForm"> 
    <div class="form-horizontal"> 
     <div class="clonedInput"> 
      <input type="button" name="btnDelete[1]" class="btnDel" value="Delete" disabled="disabled" /> 
      <div class="row"> 
       <div class="col-sm-4"> 
        <div class="form-group"> 
         <label>First</label> 
         <div class="col-md-7"> 
          <input type="text" name="firstname[1]" size="10"> 
         </div> 
        </div> 
       </div> 
       <div class="col-sm-4"> 
        <div class="form-group"> 
         <label>Second</label> 
         <div class="col-md-7"> 
          <input type="text" name="LastName[1]" size="10"> 
         </div> 
        </div> 
       </div> 
       <div class="col-sm-4"> 
        <div class="form-group"> 
         <label>Third</label> 
         <div class="col-md-7"> 
          <input type="text" name="Status[1]" size="10"> 
         </div> 
        </div> 
       </div> 
      </div> 
     </div> 
     <div> 
      <input type="button" id="btnAdd" value="add another name" /> 
     </div> 
    </div> 
</form> 
</html>

來源

2017-05-15 asreeram

你爲什麼這樣做'e.preventDefault（）'在點擊事件的開始嗎？ –

我只是嘗試不同的選項，有或沒有這段代碼，它不允許我重置值。 – asreeram

啊，好吧，是的，它可能不需要。那麼，您使用哪部分代碼重置輸入字段中的文本？和哪個輸入字段？你想使用代碼'c.children（'：text'）。attr（'name'，newN）.val（''）。end（）;'來完成這個嗎？ –

當您正在迭代輸入時，您正在嘗試輸入.find()。

變化：

$(this).find('input').val('').end();

到

$(this).val('').end();或this.value = '';

來源

2017-05-15 20:46:05

真棒謝謝你，它工作了!!!!! – asreeram

嗨，還有一個跟進問題。當我提交表單時未動態添加輸入屬性時，表單按預期工作。但是，一旦我點擊「添加其他名稱」按鈕，它會添加具有輸入屬性的新的div標籤。但是當我提交表單時，它正在嘗試重新加載頁面。你知道我可以做些什麼來避免這種行爲。 – asreeram

如果您使用的是jQuery，您需要查看'.submit（）'方法：https：//api.jquery.com/submit/ –

克隆後無法將輸入值設置爲空白

回答

相關問題