Pugでcheckedやdisabled属性を設定する

Pugでcheckedやdisabledなどの論理属性を設定する方法をメモ。

サンプルコード

trueで設定したい場合は属性のみにするか「属性名=true」の形で指定、逆にfalseにしたい場合は「属性名=false」の形で指定するといいようです。
いくつかの論理属性で試してみます。

form(novalidate)
form(novalidate=true)
form(novalidate=false)

input(type="checkbox" checked)
input(type="checkbox" checked=true)
input(type="checkbox" checked=false)

button(disabled) ボタン
button(disabled=true) ボタン
button(disabled=false) ボタン

select
  option(selected) セレクト
select
  option(selected=true) セレクト
select
  option(selected=false) セレクト

コンパイルすると以下のように出力されました。

<form novalidate></form>
<form novalidate></form>
<form></form>

<input type="checkbox" checked>
<input type="checkbox" checked>
<input type="checkbox">

<button disabled>ボタン</button>
<button disabled>ボタン</button>
<button>ボタン</button>

<select>
  <option selected>セレクト</option>
</select>
<select>
  <option selected>セレクト</option>
</select>
<select>
  <option>セレクト</option>
</select>

参考サイト

このエントリーをはてなブックマークに追加

関連記事

コメントを残す

メールアドレスが公開されることはありません。
* が付いている欄は必須項目です

CAPTCHA


コメントが承認されるまで時間がかかります。

2022年1月
 1
2345678
9101112131415
16171819202122
23242526272829
3031