Question

嘿伙计们plz帮助我试图将这个html转换为使用express的jade，但是我得到以下语法错误：意外的保留字这是我要转换为jade的html代码

<html>

<head>

<title>New Todolist</title>

<link rel="stylesheet" href="/stylesheets/jquery-ui-1.8.20.custom.css"></link>

<link rel="stylesheet" href="/stylesheets/jquery.ui.selectable.css"></link>

<script type="text/javascript" src="/javascripts/jquery-1.7.2.min.js"></script>

<script type="text/javascript" src="/javascripts/jquery-ui-1.8.20.custom.min.js"></script>

<script type="text/javascript" src="/javascripts/jquery.ui.selectable.js"></script>

<script type="text/javascript" src="/javascripts/show.js"></script>

</head>

<body>

<h1>Checklist</h1>

<a href='' id='shorcuts' style="left: 90%; position: relative;">Shotcuts</a>

    <div class='display-url' style="left: 40%; position: relative; top: 70px; width: 400px;">

                <tr id='url'>

        <td>URL :</td>

        <td><input type='text' id='url-txt'></input></td>

        <td><input type='button' id='url-btn' value='Copy'></input></td>

       </tr>

    </tr>

        <td><input type='hidden' id='url-hidden'></input></td>

    </tr>

</div>  

<div class='display-title' style="left: 40%; position: relative; top: 150px; width: 400px;">

    <tr id='title'>

        <td>Title (optional) :</td>

        <td><input type='text' id='title-txt' autocomplete='off'></input></td>

    </tr>

</div>

<div class='display-content' style="left: 40%; position: relative; top: 200px; width:400px;">

    <table class='content' tabindex="0" style=" table-layout: fixed;">

        <tr>

            <td><input type="checkbox" class='task-done'></input></td>

            <td><input type="textArea" class="descript-task" autocomplete="off"        

                              autofocus="autofocus" ></input></td>

            <td><input type="hidden" class='hidden-input'></input></td>

        </tr>

    </table>

</div>  

</body>

</html>

这是我的玉码

h1 Checklist

div.display-url

 tr

  td

   p URL :

  td

   input(type='text')

  td

    input(type='button' ,value='Copy')

  tr

   td

    input(type='hidden',id='url-hidden')

div.display-title

 tr

  td 

   p Title (optional)

  td

   input(type='text',id='title-txt',autocomplete='off') 

div.display-content

 table.content

  tbody

   tr

    td

     input(type="checkbox" ,class='task-done')

    td

     input(type="textArea" ,class='descript-task',autocomplete="off" autofocus="autofocus") 

    td 

     input(type="hidden",class='hidden-input')

布局代码

!!!

html

  head

    title= title

    link(rel='stylesheet', href='/stylesheets/jquery-ui-1.8.20.custom.css')

    link(rel='stylesheet', href='/stylesheets/jquery.ui.selectable.css')

    script(type="text/javascript",src="/javascripts/jquery-1.7.2.min.js")

    script(type="text/javascript",src="/javascripts/jquery-ui-1.8.20.custom.min.js")

    script(type="text/javascript",src="/javascripts/jquery.ui.selectable.js")

    script(type="text/javascript",src="/javascripts/show.js")

  body!= body

这是app.cn中的app.cnfigure

app.configure(function(){

  app.set('views', __dirname + '/views');

  app.set('view engine', 'jade');

  app.set("view options", {layout: false});

  app.use(express.bodyParser());

  app.use(express.methodOverride());

  app.use(app.router);

  app.use(express.static(__dirname + '/public'));

});

app.get('/', function(req, res){

   res.render("show",{title:'newtodo'});

});

Answer 1

看起来就像你在“复选框”之后错过了一个逗号：

input(type="checkbox" class='task-done')
                     ^

并且正如乔纳森指出的那样，在“自动完成”之后：

input(type="textArea" ,class='descript-task',autocomplete="off" autofocus="autofocus")
                                                               ^

HTML to jade-Syntax Error：意外的保留字

1 个答案: