Question

jquery生成添加文本字段。我只想在输入输入文本字段后启用提交按钮。谢谢。这是代码：https://jsfiddle.net/akoni/kL8jdpdc/

我尝试了这段代码，但没有运气。

(function() {
$('form > input').keyup(function() {

    var empty = false;
    $('body').find('input[type="text"]').each(function() {
        if (($(this).val() == '')) {
            empty = true;
        }
    });

    if (empty) {
        $('#submit').attr('disabled', 'disabled');
    } else {
        $('#submit').removeAttr('disabled');
    }
});
})()

Answer 1

您实际遇到的问题解释为here，基本上您应该使用on()代替keyup()。并且

input[type="text"]

将返回较少的计数，然后form > input，这是更改

$(document).on("keyup", "input[type='text']", function() {
  var empty = false;
  $('input[type="text"]').each(function() {
    if (($(this).val() == '')) {
      empty = true;
    }
  });

  if (empty) {
    $('#submit').attr('disabled', 'disabled');
  } else {
    $('#submit').removeAttr('disabled');
  }
});

jsfiddle result

希望有所帮助，

Answer 2

这应该是正确的：

(function() {
$("form > input").keyup(function() {
    var text = $("form > input").val();

    if (text == "") {
        $('#submit').attr('disabled', 'disabled');
    } else {
        $('#submit').removeAttr('disabled');
    }
});
})()

Answer 3

您可以使用解决方案https://jsfiddle.net/kL8jdpdc/9/

(function() {
    $('form').on('keyup', 'input[type="text"]', function() {
				
        var empty = false;
        $('input[type="text"]').each(function() {
            if (($(this).val() == '')) {
                empty = true;
            }
        });

        if (empty) {
            $('#submit').attr('disabled', 'disabled');
        } else {
            $('#submit').removeAttr('disabled');
        }
    });
})()


var i=1;
$(".addmore").on('click',function(){
  $('#submit').attr('disabled', 'disabled');
	count=$('table tr').length;
    var data="<tr><td><input type='checkbox' class='case'/></td>";
    data +="<td><input type='hidden' id='process_id"+i+"' name='process_name"+i+"'/>P"+i+"</td><td><input type='text' id='burst_id"+i+"' class='text-input-grey' name='burst_name"+i+"'/></td></tr>";
	$('table').append(data);
	i++;
});

function select_all() {
	$('input[class=case]:checkbox').each(function(){ 
		if($('input[class=check_all]:checkbox:checked').length == 0){ 
			$(this).prop("checked", false); 
		} else {
			$(this).prop("checked", true); 
		} 
	});
}


$(".delete").on('click', function() {
	$('.case:checkbox:checked').parents("tr").remove();
    $('.check_all').prop("checked", false); 


});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form method='post' action='' class='subscription-table'>

<table width="500" align='center' border="1" cellpadding="10" cellspacing="5">
  <tr>
    <th><input class='check_all' type='checkbox' onclick="select_all()"/></th>
    <th>Process</th>
    <th>Burst Time</th>
  </tr>
</table>

<button type="button" class='delete'>- Delete</button>
<button type="button" class='addmore'>+ Add Process</button>

											<input id="submit" type="submit" name="submit" disabled="disabled"/>
</form>

使用$('form').on('keyup', 'input[type="text"]'代替$('form > input')，如果您只选择input，那么它也会选中复选框。

当您添加新行时，您还需要停用提交按钮$('#submit').attr('disabled', 'disabled');添加到.addmore按钮的点击事件。

希望这会对你有所帮助。

Answer 4

您必须对动态添加的任何html元素使用委托绑定。

尝试更改$('form > input').keyup(function() {

到$('form').on('keyup','input',function() {

祝你好运！

在填充jquery生成的输入文本字段后启用按钮

4 个答案: