我的jQuery脚本无法在我的Node.js Express应用程序上运行

时间:2015-06-24 08:12:19

标签: javascript jquery node.js mongodb twitter-bootstrap

我正在使用Node.js,Express和MongoDB开展项目。我在将数据(包含日期和YouTube链接)以我希望的格式发布到数据库时遇到问题。数据库视图有一个表单,允许用户输入日期和相应的链接这将在条目列表中的提交表单下方查询,并在另一个视图中查询,以获取YouTube视频的链接。我使用Twitter Bootstrap来创建视图。当我使用type="date"时,浏览器使用的日期格式与我在MongoDB数据库中使用的日期格式不对应。因此,作为一种解决方法,我使用jQuery UI来更改日期格式。但是当我尝试加载脚本时(我已经使用app.use ('public/js', express.static(path.join(__dirname + 'public/js')));连接到静态文件而我的script.js文件位于public / js文件夹中但似乎不是运行

这是我的app.js代码:

var express = require('express');
var path = require('path');
var favicon = require('serve-favicon');
var logger = require('morgan');
var cookieParser = require('cookie-parser');
var bodyParser = require('body-parser');

var routes = require('./routes/index');
var users = require('./routes/users');
var database = require('./routes/database');

var app = express();

// view engine setup
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'jade');

// uncomment after placing your favicon in /public
//app.use(favicon(__dirname + '/public/favicon.ico'));
app.use(logger('dev'));
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: false }));
app.use(cookieParser());
app.use('/public', express.static(__dirname + '/public'));
app.use(express.static(path.join(__dirname, 'public')));
app.use('public/js', express.static(path.join(__dirname + 'public/js')));
app.use('public/css', express.static(path.join(__dirname + 'public/css')));

app.use('/', routes);
app.use('/users', users);
app.use('/database', database)
app.use('/create', database)

// catch 404 and forward to error handler
app.use(function(req, res, next) {
  var err = new Error('Not Found');
  err.status = 404;
  next(err);
});

// error handlers

// development error handler
// will print stacktrace
if (app.get('env') === 'development') {
  app.use(function(err, req, res, next) {
    res.status(err.status || 500);
    res.render('error', {
      message: err.message,
      error: err
    });
  });
}

// production error handler
// no stacktraces leaked to user
app.use(function(err, req, res, next) {
  res.status(err.status || 500);
  res.render('error', {
    message: err.message,
    error: {}
  });
});


module.exports = app;

app.listen(8080);

console.log("The server has started");

这是我的script.js代码:

$(document).ready(function() {
    //Date picker jQuery
    $(function() {
        $( ".datepicker" ).datepicker();
        $( "#format" ).change(function() {
          $( ".datepicker" ).datepicker( "option", "dateFormat", $( this ).val() );
        });
      });
    console.log("This worked!!");
});

以下是视图的代码:

extends layout

block content
    .container
      .row
        .col-s-12
          h1 The Mandela Diaries Database
      .row
        .col-s-4
          h3 Add Entry
      .row
        .col-s-12
          form.form-inline(method='post', action='/create')
            .form-group
              label(for='date') Date: 
              input#datepicker.form-control.datepicker(type='text', value='date')
            p
              | Format options:
              br
              select#format
                option(value='mm/dd/yy') Default - mm/dd/yy
                option(value='yy-mm-dd') ISO 8601 - yy-mm-dd
                option(value='d M, y') Short - d M, y
                option(value='d MM, y') Medium - d MM, y
                option(value='DD, d MM, yy') Full - DD, d MM, yy
                option(value="'day' d 'of' MM 'in the year' yy") With text - 'day' d 'of' MM 'in the year' yy
            .form-group
              label(for='link') Link: 
              input#link.form-control(type='string', value='link')
            button.btn.btn-default(type='submit') Submit
      .row
        #entries.col-s-12
          ul

          script(type'text/javascript', scrc='../public/js/script.js')

我正在使用Jade作为HTML的模板。

0 个答案:

没有答案