Javascript jQuery：当限制降低时帮助重新激活按钮_Javascript_Jquery_Html

Javascript jQuery：当限制降低时帮助重新激活按钮

javascript jquery html

Javascript jQuery：当限制降低时帮助重新激活按钮,javascript,jquery,html,Javascript,Jquery,Html,目前，我已经构建了这个简单的应用程序，您可以使用按钮添加输入框。然后，当达到限制时，它会阻止您添加更多内容，并显示最大输入框消息。您还可以选择删除刚才添加的框。我遇到的问题是，当用户删除一些输入框时，我不知道如何重新激活“添加”按钮。我对jQuery非常陌生，所以如果有更好的代码编写方法，我会洗耳恭听。我已经在JSFIDLE中重新创建了我的示例：我希望这样做的方式是当您单击一个删除按钮时，如下所示： $("#remove").click(function(e){ $("#MAX").hid

目前，我已经构建了这个简单的应用程序，您可以使用按钮添加输入框。然后，当达到限制时，它会阻止您添加更多内容，并显示最大输入框消息。您还可以选择删除刚才添加的框。我遇到的问题是，当用户删除一些输入框时，我不知道如何重新激活“添加”按钮。我对jQuery非常陌生，所以如果有更好的代码编写方法，我会洗耳恭听。我已经在JSFIDLE中重新创建了我的示例：

我希望这样做的方式是当您单击一个删除按钮时，如下所示：

$("#remove").click(function(e){
  $("#MAX").hide('<p>MAX</p>');
});

$（“#删除”）。单击（函数（e）{
$（“#MAX”）.hide（“MAX”）；
});

而不是这个：

  $("#Input").on("click","#remove", function(e){
    e.preventDefault(); $(this).parent('div').remove(); x--;
  });

试试这个：

  $("#Input").on("click","#remove", function(e){
    e.preventDefault(); 
    $(this).parent('div').remove(); 
    x--;
    $("#add").prop("disabled",false);
    $("#MAX").find('p').remove();
  });

与此相反：

  $("#Input").on("click","#remove", function(e){
    e.preventDefault(); $(this).parent('div').remove(); x--;
  });

试试这个：

  $("#Input").on("click","#remove", function(e){
    e.preventDefault(); 
    $(this).parent('div').remove(); 
    x--;
    $("#add").prop("disabled",false);
    $("#MAX").find('p').remove();
  });

在

#删除中，单击事件处理程序
$("#Input").on("click", "#remove", function(e) {
    e.preventDefault(); $(this).parent('div').remove(); x--;
});

添加以下行以更新#add
的disabled
属性：
$('#add').prop('disabled', false);

例如：
$("#Input").on("click", "#remove", function(e) {
    e.preventDefault(); $(this).parent('div').remove(); x--;
    $('#add').prop('disabled', false);
    $('#MAX').hide();
});

在#删除中，单击事件处理程序
$("#Input").on("click", "#remove", function(e) {
    e.preventDefault(); $(this).parent('div').remove(); x--;
});

添加以下行以更新#add
的disabled
属性：
$('#add').prop('disabled', false);

例如：
$("#Input").on("click", "#remove", function(e) {
    e.preventDefault(); $(this).parent('div').remove(); x--;
    $('#add').prop('disabled', false);
    $('#MAX').hide();
});

在你的内心
$("#Input").on("click","#remove", function(e){

要重新启用“添加”按钮，您需要：
$("#add").prop("disabled",false);

要删除MAX消息，您可以：
$("#MAX p:first").remove();

该报告已更新
下面是代码片段：

$（文档）.ready（函数（）{
var max_字段=5；
var x=1；
$（“#添加”）。单击（函数（e）{
e、 预防默认值（）；
如果（x”）；
$（this.prop（“disabled”，true）；
}
});
$（“#输入”）。在（“单击”，“删除”，函数（e）{
e、 预防默认值（）；
x--；
$（“添加”）.prop（“禁用”，false）；
$（this.parent（'div'）.remove（）；
$（“#MAX p:first”）.remove（）；
});
});

添加
在您的
$("#Input").on("click","#remove", function(e){

要重新启用“添加”按钮，您需要：
$("#add").prop("disabled",false);

要删除MAX消息，您可以：
$("#MAX p:first").remove();

该报告已更新
下面是代码片段：

$（文档）.ready（函数（）{
var max_字段=5；
var x=1；
$（“#添加”）。单击（函数（e）{
e、 预防默认值（）；
如果（x”）；
$（this.prop（“disabled”，true）；
}
});
$（“#输入”）。在（“单击”，“删除”，函数（e）{
e、 预防默认值（）；
x--；
$（“添加”）.prop（“禁用”，false）；
$（this.parent（'div'）.remove（）；
$（“#MAX p:first”）.remove（）；
});
});

添加
有一种方法
$("#Input").on("click","#remove", function(e){
    e.preventDefault(); 
    $(this).parent('div').remove(); x--;
    $('#MAX').html('');
    if( x===4 ){
        $('#add').prop('disabled', false);
    }
});

当您删除第五个元素时，它会启用“添加”按钮一次
这里有一个
有一个方法
$("#Input").on("click","#remove", function(e){
    e.preventDefault(); 
    $(this).parent('div').remove(); x--;
    $('#MAX').html('');
    if( x===4 ){
        $('#add').prop('disabled', false);
    }
});

当您删除第五个元素时，它会启用“添加”按钮一次
这是一个
当您删除其中一个字段时，必须检查限制是否大于输入字段的数量
$(document).ready(function() {
  var max_fields = 5;
  var x = 1;

  $("#add").click(function(e){
    e.preventDefault();
    if(x < max_fields){
      x++;
      $("#Input").append(
        '<div><input type="text" name="mytext[]"/><a href="#" id="remove">Remove</a></div>'
      );
    }else if(x == max_fields){
        $("#MAX").append('<p>MAX</p>');
      $(this).prop("disabled",true);
    }
  });

  $("#Input").on("click","#remove", function(e){
    e.preventDefault(); $(this).parent('div').remove(); x--;

    if(x < max_fields){  //here you check if lower than limit
       $('#add').prop("disabled", false);
       $("#MAX").html(''); //deleting the content of max
    }

  });
});

$（文档）.ready（函数（）{
var max_字段=5；
var x=1；
$（“#添加”）。单击（函数（e）{
e、 预防默认值（）；
如果（x”）；
$（this.prop（“disabled”，true）；
}
});
$（“#输入”）。在（“单击”，“删除”，函数（e）{
e、 preventDefault（）；$（this）.parent（'div'）.remove（）；x--；
如果（x

删除其中一个字段时，必须检查限制是否大于输入字段的数量
$(document).ready(function() {
  var max_fields = 5;
  var x = 1;

  $("#add").click(function(e){
    e.preventDefault();
    if(x < max_fields){
      x++;
      $("#Input").append(
        '<div><input type="text" name="mytext[]"/><a href="#" id="remove">Remove</a></div>'
      );
    }else if(x == max_fields){
        $("#MAX").append('<p>MAX</p>');
      $(this).prop("disabled",true);
    }
  });

  $("#Input").on("click","#remove", function(e){
    e.preventDefault(); $(this).parent('div').remove(); x--;

    if(x < max_fields){  //here you check if lower than limit
       $('#add').prop("disabled", false);
       $("#MAX").html(''); //deleting the content of max
    }

  });
});

$（文档）.ready（函数（）{
var max_字段=5；
var x=1；
$（“#添加”）。单击（函数（e）{
e、 预防默认值（）；
如果（x”）；
$（this.prop（“disabled”，true）；
}
});
$（“#输入”）。在（“单击”，“删除”，函数（e）{
e、 preventDefault（）；$（this）.parent（'div'）.remove（）；x--；
如果（x

要重新启用添加按钮，请添加$（'add'）.prop（'disabled'，false）
要删除事件处理程序，请单击事件处理程序
此外，对于最大显示，我建议将MAX
放在html中，并将\MAX
div设置为style=“display:none；”“
，然后使用$（'MAX'）.show（）
和$（'MAX'）.hide（）
来显示最大指示器。如果按照我的说明添加上述代码以重新启用“添加”按钮，您将看到原因：
按钮重新启用后，最大指示灯仍保留在页面上
一旦重新启用“添加”按钮，然后再次单击该按钮，直到第二次达到最大字段数，将向div
添加一个额外的，从而创建重复的指示器

要重新启用添加按钮，请添加$（'#add'）.prop（'disabled'，false）
要删除事件处理程序，请单击事件处理程序
此外，对于最大显示，我建议将MAX
放在html中，并将\MAX
div设置为style=“display:none；”“
，然后使用$（'MAX'）.show（）
和$（'MAX'）.hide（）
来显示最大指示器。如果按照我的说明添加上述代码以重新启用“添加”按钮，您将看到原因：
按钮重新启用后，最大指示灯仍保留在页面上
一旦重新启用“添加”按钮，然后再次单击该按钮，直到第二次达到最大字段数，将向div
添加一个额外的，从而创建重复的指示器

你不需要