jQuery not(:disabled)で無効化されたinput要素を除外する
環境
Google Chrome 105.0.5195.127
Windows 10 Home 64bit
jquery 3.6.1
構文
var 変数名 =$('input:not(:disabled)’)
「input:not(:disabled)」を使用してdisabled属性が付与されたinput要素を除外する指定ができます。
変数名.each(function(index,element){処理コード}
「each()」を使ってすべてのinput要素を出力しています
使用例
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
$('#btnchk').click(function(){
//disabled属性が付与されたinput要素を除外する
var ele = $('input:not(:disabled)');
//すべてのinput要素を出力する
ele.each(function( index, element ) {
console.log( element );
})
});
});
</script>
</head>
<body>
<input type="button" id="btnchk" value="確認"><br>
<input type="text" value="東京"><br>
<input type="text" value="山田" disabled>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
$('#btnchk').click(function(){
//disabled属性が付与されたinput要素を除外する
var ele = $('input:not(:disabled)');
//すべてのinput要素を出力する
ele.each(function( index, element ) {
console.log( element );
})
});
});
</script>
</head>
<body>
<input type="button" id="btnchk" value="確認"><br>
<input type="text" value="東京"><br>
<input type="text" value="山田" disabled>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
$('#btnchk').click(function(){
//disabled属性が付与されたinput要素を除外する
var ele = $('input:not(:disabled)');
//すべてのinput要素を出力する
ele.each(function( index, element ) {
console.log( element );
})
});
});
</script>
</head>
<body>
<input type="button" id="btnchk" value="確認"><br>
<input type="text" value="東京"><br>
<input type="text" value="山田" disabled>
</body>
</html>
実行結果
「確認」ボタンを押すと、コンソールに下記メッセージを出力します
<input type="button" id="btnchk" value="確認">
<input type="text" value="東京">