如何使用jQuery清除表单字段?

时间:2018-10-17 18:50:24

标签: javascript jquery html css

我将clone()和remove()与div元素一起使用。女巫制作div元素克隆。 在此div元素中,我已提交了

$('.wrapper').on('click', '.remove', function() {
  $(this).closest('.wrapper').find('.element:not(:first):last').remove();
  setCloneButtonVisibility();
});

var cloneLimit = 12;

$('.wrapper').on('click', '.clone', function() {
  if ($('.results .element').length <= cloneLimit) { // just to make testing easier
    $(this).closest('.wrapper').find('.element:first').clone().appendTo('.results');
  }
  setCloneButtonVisibility();
});

function setCloneButtonVisibility() {
  $('.wrapper .clone').toggle($('.results .element').length < cloneLimit);
}
		
		$('.2').val('');
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="wrapper">
  <div class="element">
	  <input  name="text" type="text" />
 
	</div>
  <div class="results"></div>
  <div class="buttons">
    <button class="clone">clone</button>
    <button class="remove">remove</button>
  </div>
</div>

当我单击克隆时,它将克隆文本字段。 但是,如果我在归档中键入了文本,然后在克隆归档中进行了克隆,那么我在第一个归档中就得到了相同的文本。如何清除每个新的克隆字段

3 个答案:

答案 0 :(得分:2)

找到Get-HotFix | % { if($_.HotFixID -match "KB2687455") { (get-wmiobject win32_computersystem).name | Out-File C:\temp\Installed.txt -append } else{ (get-wmiobject win32_computersystem).name | Out-File C:\temp\NotInstalled.txt -Append break } } 元素并将其值设置为空。

input
$('.wrapper').on('click', '.remove', function() {
  $(this).closest('.wrapper').find('.element:not(:first):last').remove();
  setCloneButtonVisibility();
});

var cloneLimit = 12;

$('.wrapper').on('click', '.clone', function() {
  if ($('.results .element').length <= cloneLimit) { // just to make testing easier
    $(this).closest('.wrapper').find('.element:first').clone()
      // end() reverts last filtering operation
      .find(':input').val('').end().appendTo('.results');
  }
  setCloneButtonVisibility();
});

function setCloneButtonVisibility() {
  $('.wrapper .clone').toggle($('.results .element').length < cloneLimit);
}

参考文献:

.end()

:input

答案 1 :(得分:0)

如何将该值设置为null?

$('.wrapper').on('click', '.clone', function() {
  if ($('.results .element').length <= cloneLimit) { // just to make testing easier
    var input = $(this).closest('.wrapper').find('.element:first').clone().find("input").val("");
input.appendTo('.results');
  }
  setCloneButtonVisibility();
});

答案 2 :(得分:0)

var cloneLimit = 10;
var inputName = function makeid() {
  var text = "";
  var possible = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";

  for (var i = 0; i < 5; i++)
    text += possible.charAt(Math.floor(Math.random() * possible.length));

  return text;
}


// handle click and add class
$('.remove').on("click", function(){
 	$(this).parents('.wrapper').find('.results .element:eq(-1)').remove();
});

$('.clone').on("click", function(){
 var $clone = $(this).parents('.wrapper').find('.element:first').clone();
 $clone.find('input').attr('name',inputName());
 $clone.appendTo('.results');	
});

$('.wrapper button').on('click', function(){
	if( $('.results .element').length < cloneLimit) {
	  $('.clone').show();
	}
	else {
	 $('.clone').hide();
	}
});
body {
  background: #20262E;
  padding: 20px;
  font-family: Helvetica;
}

input {
	margin-bottom: 20px;
}

button {
  background: #0084ff;
  border: none;
  border-radius: 5px;
  padding: 8px 14px;
  font-size: 15px;
  color: #fff;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="wrapper">
  <div class="element">
	  <input  name="text" type="text" />
 
	</div>
  <div class="results"></div>
  <div class="buttons">
    <button class="clone">clone</button>
    <button class="remove">remove</button>
  </div>
</div>

我已经制作了克隆并删除按钮,这可能就是您所需要的。