Pug (Jade) HTML表单

11

我想用Pug创建以下简单表单:

<body>
     <form action="/add_movie" method="POST">
       <p>
         title: <input type="text" name="title" value=""/>
         year: <input type="text" name="year" value=""/>
         imdb: <input type="text" name="imdb" value=""/>
       </p>
       <input type="submit" value="Submit"/>
     </form>
  </body>

但是我无法仅使用一个p标签使表单工作。因此,我想出了以下解决方案:

body
    h1= "Add a movie!"
    form(action="/new_movie" method="POST")
    p Title:
      input(type="text" name="title" placeholder="")
    p Year:
      input(type="text" name="year" placeholder="")
    p imdb:
      input(type="text" name="imdb" placeholder="")
    input(type="submit")

有没有一种方法可以在一个 p 标签内使用 Pug 重新创建原始的 HTML 表单?

3个回答

22

使用管道文本将内容标记为现有块中的文本。

body
  form(action='/add_movie', method='POST')
    p
      | title: 
      input(type='text', name='title', value='')
      |          year: 
      input(type='text', name='year', value='')
      |          imdb: 
      input(type='text', name='imdb', value='')
    input(type='submit', value='Submit')

...但是你只应该在真正需要分段时使用段落,同时你应该学会使用标签


你好,我们能否使用标签来提供一个例子?即使只是提供一个使用 .pug 的示例链接也对我们这些网站开发新手有所帮助。谢谢! - Nathan majicvr.com

2
我使用这个网站https://html2jade.org/将HTML转换为Pug,它非常有用。
对于您的HTML提供的解决方案是这样的(与@Quentin的答案相同)。
html
  head
  body
    form(action='/add_movie', method='POST')
      p
        | title: 
        input(name='title', value='', type='text')
        |          year: 
        input(name='year', value='', type='text')
        |          imdb: 
        input(name='imdb', value='', type='text')
      input(value='Submit', type='submit')

-1
body
    form(action="/login" method="POST")
    p Username:
      input(type="text" name="username" placeholder="Enter Your Username ")
    p Password:
      input(type="password" name="password" placeholder="Enter Your Password ")
    input(type="submit")

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接