禁用特定表單字段單擊

Question

我已經禁用按鈕點擊的具體領域，如我使用jquery我可以取消這些

各個領域已經兩種形式在我的網頁這樣

< form method='post' action='' class='myform'> 
<input type='text' name='name_0'> 
<input type='email' name='email_0'> 
<input class='btn' type='submit'> 
</form> 

< form method='post' action='' class='myform'> 
<input type='text' name='name_1'> 
<input type='email' name='email_1'> 
<input class='btn' type='submit'> 
</form> 

$(document).ready(function(){        
    $('.btn').click(function(){ 
     $("input").prop('disabled', true); 
    }); 
}); 

但我不知道如何定位像NAME_0，EMAIL_0特定字段當我第一次提交按鈕，請幫我這個

Answer 1

要禁用它們，你將使用屬性選擇：

$("input[name='name_0']").prop('disabled', true); 

jQuery Attribute Selectors

如果你有多個項目，你可以將它們組合起來：

$("input[name='name_0'],input[name='email_0']").prop('disabled', true); 

你更大的問題是，你想通過點擊的東西用一個類來確定形式。爲了縮小下來，你可以做一些DOM遍歷：

$(document).on('click', '.btn', function(event) { 
    // which form? this one! 
    var currentForm = $(this).closest('form'); 
    // disable all inputs for this form 
    currentForm.find('input').prop('disabled', true); 
}); 

現在我不必知道它輸入到禁止（如果我想禁用所有的）。我只需要在按鈕的表單中找到輸入。

Answer 2

你應該閱讀有關selectors

$("input[name=name_0]").prop('disabled', true); 

或一個jQuery的解決方案可以通過使用.closest（目標吧）.find（）

$(document).ready(function(){        
    $('.btn').click(function(e){ 
     e.preventDefault(); 
     $(this).closest('form').find("input[type=text]").prop('disabled', true); 
     $(this).closest('form').find("input[type=email]").prop('disabled', true); 
    }); 
}); 

提交表單並禁用所有輸入並專注於下一個表格上的第一個輸入

$(document).ready(function(){        
    $('.myform').on('submit',function(e){ 
     e.preventDefault(); 
     $(this).closest('form').find("input").prop('disabled', true); 
     $(this).next('form').find('input:first').focus(); 
    }); 

}); 

Working Demo