javascript - 对焦和模糊功能有问题

Question

我有一个表单，其中有三个字段和两个按钮。 <强> FIDDLE

单击添加可选电子邮件地址按钮会添加一个新的电子邮件字段，这很好。我的问题是保存按钮。我希望保存按钮将保持禁用状态，直到用户单击该字段或在输入字段中添加任何值。所以，

• 如果用户单击任何输入字段，“保存”按钮将变为 活跃
• 如果用户输入一个值，它将保持事件状态。
• 如果用户点击输入但没有给出任何值，它将发生变化再次禁用。

与添加可选电子邮件地址新添加的输入相同

在我的代码中，如果单击后输入上没有给出任何值并且不适用于新添加的输入，则它不会返回禁用状态。我不确定原因。任何帮助都会拯救我的一天。

JS

$("body").on('focus', '.user-input input', function() {  
   $(".update-change").removeAttr('disabled');
}).blur(function() {
    if ($("").val() == '') {
        $(".update-change").attr('disabled', 'disabled');
    }
});

$('.update-list-confirm').click(function(){
    $(".update-change").attr('disabled', 'disabled');
});


// Add email
$("body").on('click', '.add-new-email', function() {
    var newemail = '<div class="form-group"><em class="pull-right">Optional</em><input type="email" name="userEmail" class="form-control" id="" placeholder="mymail@mail.com"></div>';

$(newemail).insertBefore(this);     
});

Answer 1

尝试使用此方法来处理同一输入元素上的模糊

$("body").on('focus', '.user-input input', function() {  
   $(".update-change").removeAttr('disabled');
}).on ('blur', '.user-input input', function() {
    if ($(this).val() === '') {
        $(".update-change").attr('disabled', 'disabled');
    }
});