javascript - キー イベントの入力フィールドの JQuery SetAttribute

Question

ユーザーがテキスト/チェックボックスに文字を入力した場合、入力フィールドの属性を設定したい。ここに私が試しているJava Scriptへのリンクがあります。以下はコードです

<input type="text" />
<div id="output"></div>

$('input').bind('input keyup', function() {
    $('#output').html($(this).val());
    $(this).setAttribute('aria-invalid', 'true');
});

しかし、それは機能していません。誰かが私を導くことができますか?

Answer 1

LIVE DEMO

メソッドdataの代わりに属性を使用してみてください。.data()とても簡単です:

$('input').on('input keyup', function() {
    $('#output').html( this.value );
    $(this).data('aria_invalid', 'true');
});

Answer 2

jQuery オブジェクトと実際の DOM ノードを混同しています。そのイベント ハンドラーでthisは、 は DOM ノードであり、$(this)それを参照する jQuery オブジェクトです。

DOM ノード自体にsetAttribute関数があり、jQuery オブジェクトに.attr()関数があるため、次のようになります。

this.setAttribute('aria-invalid', 'true');
or
$(this).attr('aria-invalid', 'true');

Answer 3

jQuery オブジェクトにはメソッドがありません.setAttribute()。JQuery の .attr() メソッド (または Dom Element .setAttribute() メソッド) を使用します。

$('input').bind('input keyup', function() {
    $('#output').html($(this).val());

    $(this).attr('aria-invalid', 'true');
    // or
    // this.setAttribute('aria-invalid', 'true');
});