jQuery不能使用Express

-6

我的jquery.js適用於使用JavaScript，但不適用於jQuery。 jQuery文件不起作用。jQuery不能使用Express

下面是我的app.js

var express = require('express') 

var app = express(); 

app.set('view engine', 'ejs') 

app.get('/', function(req, res){ 
    res.sendfile(__dirname +'/views/index.html'); 
}) 

app.get('/about', function(req, res){ 
    res.send('this is the about page'); 
}) 

app.get('/roster', function(req, res){ 
    res.send('this is the roster page'); 
}) 

app.get('/contact', function(req, res){ 
    res.send('this is the conact page'); 
}) 


app.use(express.static('public')); 

app.listen(3000);

下面是我的index.html

<head> 
    <script type="text/javascript" src="/js/jquery.js"></script> 
    <link href="/css/index.css" rel="stylesheet" type="text/css" /> 

</head> 
<p>hi<p> 
<h1><a href="/contact">contact</a></h1> 

<body> 
     <div id="red"></div> 
     <div id="blue"></div> 
     <div id="yellow"></div> 
     <div id="green"></div> 
</body>

而且低於去年是我的jquery.js。我知道所有事情都是正確路由的，因爲我運行了一個警報JavaScript並且它正常工作。

$(document).ready(function() { 
    $('div').mouseenter(function() { 
     $(this).animate({ 
      height: '+=10px' 
     }); 
    }); 
    $('div').mouseleave(function() { 
     $(this).animate({ 
      height: '-=10px' 
     }); 
    }); 
    $('div').click(function() { 
     $(this).toggle(1000); 
    }); 
});

來源

2017-07-19 Ben Mingo

這是一個不是co的社區網站mmercial。不要提供資金。 – marekful

*「任何幫助我解決這個問題的人，我會給你5美元」 - 所以如果有200人回答，你準備支付1000美元？無論如何，你似乎沒有在你的頁面上包含jQuery庫。 – nnnnnn

還有另一個在express中使用jQuery的庫。請參閱https://github.com/cheeriojs/cheerio –

嘗試增加的jQuery到您的網頁：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

修理你的HTML後（你的元素都應該是它的工作原理<body>和解決您的動畫目標內

$(document).ready(function() { 
 
    $('div').mouseenter(function() { 
 

 
    $(this).animate({ 
 
     height: 60 
 
    }); 
 
    }); 
 
    $('div').mouseleave(function() { 
 
    var h = ($(this).height() + '').replace('px', ''); 
 
    var hto = Number(h) - 10; 
 
    $(this).animate({ 
 
     height: 20 
 
    }); 
 
    }); 
 
    $('div').click(function() { 
 
    $(this).toggle(1000); 
 
    }); 
 
});

#red { 
 
    width: 100%; 
 
    height: 20px; 
 
    background: red; 
 
} 
 

 
#blue { 
 
    width: 100%; 
 
    height: 20px; 
 
    background: blue; 
 
} 
 

 
#yellow { 
 
    width: 100%; 
 
    height: 20px; 
 
    background: yellow; 
 
} 
 

 
#green { 
 
    width: 100%; 
 
    height: 20px; 
 
    background: green; 
 
}

<!DOCTYPE html> 
 
<html lang="html"> 
 

 
<head> 
 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
    <script type="text/javascript" src="/js/jquery.js"></script> 
 
    <link href="/css/index.css" rel="stylesheet" type="text/css" /> 
 

 
</head> 
 

 

 
<body> 
 

 
    <p>hi</p> 
 
     <h1><a href="/contact">contact</a></h1> 
 
     <div id="red"></div> 
 
     <div id="blue"></div> 
 
     <div id="yellow"></div> 
 
     <div id="green"></div> 
 
</body> 
 

 

 
</html>

。

來源

2017-07-19 04:08:07

非常感謝你！如果你想讓$ 5讓我知道。無論哪種方式巨大的幫助。所以它不工作的原因，我假設是因爲沒有正確的HTML標題，並忘記這一點？ –

是的，您沒有jQuery並且該標籤加載它。我不想要你的錢。你可以做什麼是閱讀這個https://stackoverflow.com/help/someone-answers並花一些時間來熟悉這個網站的工作原理。 –

可能是因爲jQuery沒有綁定到動態元素。考慮使用靜態元素的父選擇器。

$('body').on("click", "red", func(e){ 

//do something 

});

等等等等

這顯然是在被加載jQuery的所有隊伍。

此外，您的HTML格式不正確。沒有HTML應該駐留在</head>和<body>之間

此外，請考慮在關閉</body>標記之前調用您的庫。

來源

2017-07-19 03:11:34

app.set('view engine', 'ejs') 
app.use(express.static('./public')); 

// use static middleware before all your routes 


app.get('/', function(req, res){ 
    res.sendfile(__dirname +'/views/index.html'); 
}) 

app.get('/about', function(req, res){ 
    res.send('this is the about page'); 
}) 

app.get('/roster', function(req, res){ 
    res.send('this is the roster page'); 
}) 

app.get('/contact', function(req, res){ 
    res.send('this is the conact page'); 
})

來源

2017-07-19 03:25:24 manas

jQuery不能使用Express

回答

相關問題