「jQuery」attrメソッドに関数を設定するサンプル

2022年7月11日

環境

Google Chrome　103.0.5060.114
Windows 10 Home 64bit
jQuery 3.6.0

構文

$(要素).attr(
      "value",function(){
       処理コード
});

attrメソッドの２つめの引数は関数を使用します。
戻り値が属性値として設定されます。

使用例

<!DOCTYPE html>
<html>
<head>
</head>
<body>
名前:<input type="text" id="txtName" value="山田" maxlength="5" disabled>
<p><input type="button" id="btnReg" value="検証" ></p>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>

<script>
  $("#btnReg").click(function() {
    // 属性値を設定
    $("#txtName").attr(
      "value",function(){
        return "大崎";
    });
  });

</script>
</body>
</html>

結果
「検証」ボタンを押下すると、テキストボックスに「大崎」が表示されます。

jQuery

Posted by arkgame

関連記事: