javascript - 要素がボタンまたはテキストボックスであるかどうかを判断する方法

Question

input要素がbuttonタイプであるtextか、jqueryのタイプであるかをどのように判断できますか？

ありがとう

Answer 1

$('input').attr('type')

また

$('input').prop('type')

デモ

また

$('input').is(':button');

$('input').is(':text');

デモ

また

$(target)[0].tagName

デモ

Answer 2

あなたが持っている場合：

var field = $("some selector that finds the input");

それで

field[0].tagName

...INPUTまたはBUTTONまたはSELECTまたはTEXTAREAのいずれかになり、フィールドの作成に使用されたタグを示します。

の場合INPUT、

field[0].type
// or
field.attr('type')
// or
field.prop('type')

...inputタグのタイプになります (例: "text"、"button"など)。

実例| ソース:

HTML:

<input type="text" value="text field">
<br><input type="button" value="input button">
<br><select><option>select</option></select>
<br><textarea>textarea</textarea>
<br><button>button</button>

JavaScript:

jQuery(function($) {

  $("input, select, textarea, button").each(function(index) {
    var msg;
    var field = $(this);
    msg = "[" + index + "]: tagName is " + field[0].tagName;
    if (field[0].tagName === "INPUT") {
      msg += ", and type is " + field.prop('type');
    }
    display(msg);
  });

  function display(msg) {
    $("<p>").html(msg).appendTo(document.body);
  }
});

出力：

[0]: tagName は INPUT、type はテキスト
[1]: tagName は INPUT、type はボタン
[2]: tagName は SELECT です
[3]: tagName は TEXTAREA です
[4]: tagName は BUTTON です

field = $(this)ここでは、各要素を jQuery ラッパーで囲むためだけに使用したことに注意してください。生の DOM 要素参照が既にある場合 (そのループで行うように、 as this)、それを行う必要はなく、elm.tagNameand をelm.type直接使用するだけです。

Answer 3

要素のタグ名を確認します。

element.prop('tagName')

<input>タグについては、タイプも確認してください。

element.prop('type');