Question

我正在尝试创建一个包含2个输入字段和1个按钮的简单表单。

这是需要翻译成Jade的HTML：

<form name="input" action="html_form_action.asp" method="get">
  Username: <input type="text" name="user" />
  Password: <input type="text" name="pswd" />
  <input type="submit" value="Submit" />
</form>

在我将这台计算机扔出窗外并在Jade模板语言开发人员之后发送一个杀人小队之前，请帮助我。

Answer 1

form(name="input", action="html_form_action.asp", method="get")
  | Username:
  input(type="text", name="user")

  | Password:
  input(type="text", name="pswd")

  input(type="submit", value="Submit")

Answer 2

有更优雅和正确的方式。不要忘记可用性。并且跳过冒号它不是纸质形式！

form(name="input", action="html_form_action.asp", method="get")
  key Username
    input(type="text", name="user")

  key Password
    input(type="password", name="pswd")

  input(type="submit", value="Submit")

对于表单渲染我正在使用mixins。它使我的代码可重用且灵活。看这里：

mixin text(name, value, title)
  key=title
    input(type="text" name=name value=value)

mixin password(name, value, title)
  key=title
    input(type="password" name=name value=value)

mixin submit(name, value)
  input(type="submit" name=name value=value)

form(name="input", action="html_form_action.asp", method="post")
  mixin text('user', null, 'User')
  mixin password('pswd', null, 'Password')
  mixin submit('do', 'Login')

Answer 3

我最近注意到在Jade github页面上添加了一个HTML to Jade转换器的链接：

https://github.com/donpark/html2jade

如果你有多个要转换的话，可能值得一试，而不是手工翻译。

Answer 4

您可以在Jade文档中使用纯HTML，它将正确呈现（只是因为您需要使用它！）

Answer 5

有很多在线HTML到JADE转换。这是一个很好的。

HTML to Jade converter

HTML to Jade帮助

5 个答案: