[解決済み] jQuery - 入力要素がテキストボックスか選択リストかを判断する
2023-02-01 03:14:13
質問
jQueryの:inputフィルターが返す要素がテキストボックスかセレクトリストかを判断するにはどうしたらよいでしょうか?
それぞれ異なる動作をさせたいのですが(textboxはテキスト値を返し、selectはキーとテキストの両方を返します。)
設定例です。
<div id="InputBody">
<div class="box">
<span id="StartDate">
<input type="text" id="control1">
</span>
<span id="Result">
<input type="text" id="control2">
</span>
<span id="SelectList">
<select>
<option value="1">Option 1</option>
<option value="2">Option 2</option>
<option value="3">Option 3</option>
</select>
</span>
</div>
<div class="box">
<span id="StartDate">
<input type="text" id="control1">
</span>
<span id="Result">
<input type="text" id="control2">
</span>
<span id="SelectList">
<select>
<option value="1">Option 1</option>
<option value="2">Option 2</option>
<option value="3">Option 3</option>
</select>
</span>
</div>
と書いて、スクリプトを
$('#InputBody')
// find all div containers with class = "box"
.find('.box')
.each(function () {
console.log("child: " + this.id);
// find all spans within the div who have an id attribute set (represents controls we want to capture)
$(this).find('span[id]')
.each(function () {
console.log("span: " + this.id);
var ctrl = $(this).find(':input:visible:first');
console.log(this.id + " = " + ctrl.val());
console.log(this.id + " SelectedText = " + ctrl.find(':selected').text());
});
どのように解決するのですか?
こうすればいいんです。
if( ctrl[0].nodeName.toLowerCase() === 'input' ) {
// it was an input
}
または、より遅いですが、より短く、よりきれいな、このような。
if( ctrl.is('input') ) {
// it was an input
}
より具体的に知りたい場合は、型をテストすることができます。
if( ctrl.is('input:text') ) {
// it was an input
}
関連
-
[解決済み] jQueryを使って要素のIDを取得するにはどうすればよいですか?
-
Uncaught SyntaxError: 予期しない入力の終了
-
[解決済み] jQueryで要素が非表示になっているかどうかを確認するには?
-
[解決済み] jQueryで要素にスクロールする
-
[解決済み] jQueryで入力を無効化/有効化する?
-
[解決済み] jQueryを使ってドロップダウンリスト(セレクトボックス)から選択されたテキストを取得する
-
[解決済み] jQueryで複数のクラスを持つ要素を選択するにはどうすればよいですか?
-
[解決済み] jQueryで名前を指定して要素を選択するには?
-
[解決済み] jQuery データ属性の値に基づいて要素を検索する方法は?
-
[解決済み] .text()を使って子タグにネストされていないテキストのみを取得する方法
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み] チェックボックスのチェック/アンチェックは、jqueryを使用していますか?重複
-
[解決済み] Google Maps APIでマウスのスクロールホイールによる拡大縮小を無効にする方法
-
[解決済み] 動的に生成された要素でクリックイベントが動作しない [duplicate]
-
[解決済み] クリックボタンでクリップボードにコピー
-
[解決済み] jQuery: outer html() [重複]。
-
[解決済み] jQueryのn番目の要素を取得する方法
-
[解決済み】jQueryがリクエストボディに有効なjsonを投稿する。
-
[解決済み] jQueryで選択されたオプションのインデックスを取得する
-
[解決済み] jQuery append() - 追記された要素を返す
-
[解決済み] jQueryを使用して文字列から最後の文字を削除する方法は?