1
以下HTML獨立工作golang JavaScript的UI問題
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="./jquery-1.7.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('.del').live('click',function(){
$(this).parent().parent().remove();
});
$('.add').live('click',function(){
$(this).val('Delete');
$(this).attr('class','del');
var appendTxt = "<tr><td><input type='text' name='name[]' /></td> <td><input type='text' name='value[]' /></td> <td><input type='checkbox' name='regex[]' /></td><td><input type='button' class='add' value='Add More' /></td></tr>";
$("tr:last").after(appendTxt);
});
});
</script>
<style>
table {
table-layout: fixed;
width:1200px;
}
input{
width:285px;
}
</style>
</head>
<body>
<form method="post" action="/silencealert">
<table id="options-table">
<tr>
<td>Name</td>
<td>Value</td>
<td>Regex</td>
<td> </td>
</tr>
<tr>
<td><input type="text" name="name[]" /></td>
<td><input type="text" name="value[]" /></td>
<td><input type="checkbox" name="regex[]" /></td>
<td><input type="button" class='del' value='Delete' /></td>
</tr>
<tr>
<td><input type="text" name="name[]" /></td>
<td><input type="text" name="value[]" /></td>
<td><input type="checkbox" name="regex[]" /></td>
<td><input type="button" class="add" value="Add More" /></td>
</tr>
</table>
<br>
<label for="number"> Expires(Days[1-30]): </label>
<input type="number" min="1" max="30" value="" name="days">
<br><br>
<button type="submit">SilenceAlert</button>
</form>
<hr>
<small>User: %s</small>
</body>
通過上述文件時，我上添加更多新的表格行被添加點擊，當我點擊刪除錶行被刪除。這是預期的behaiour。
我使用上面的HTML在golang項目（文件 - main.go）
package main
import (
"fmt"
"github.com/gorilla/mux"
"net/http"
)
const manage_alertsPage = `
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="./jquery-1.7.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('.del').live('click',function(){
$(this).parent().parent().remove();
});
$('.add').live('click',function(){
$(this).val('Delete');
$(this).attr('class','del');
var appendTxt = "<tr><td><input type='text' name='name[]' /></td> <td><input type='text' name='value[]' /></td> <td><input type='checkbox' name='regex[]' /></td><td><input type='button' class='add' value='Add More' /></td></tr>";
$("tr:last").after(appendTxt);
});
});
</script>
<style>
table {
table-layout: fixed;
width:1200px;
}
input{
width:285px;
}
</style>
</head>
<body>
<form method="post" action="/silencealert">
<table id="options-table">
<tr>
<td>Name</td>
<td>Value</td>
<td>Regex</td>
<td> </td>
</tr>
<tr>
<td><input type="text" name="name[]" /></td>
<td><input type="text" name="value[]" /></td>
<td><input type="checkbox" name="regex[]" /></td>
<td><input type="button" class='del' value='Delete' /></td>
</tr>
<tr>
<td><input type="text" name="name[]" /></td>
<td><input type="text" name="value[]" /></td>
<td><input type="checkbox" name="regex[]" /></td>
<td><input type="button" class="add" value="Add More" /></td>
</tr>
</table>
<br>
<label for="number"> Expires(Days[1-30]): </label>
<input type="number" min="1" max="30" value="" name="days">
<br><br>
<button type="submit">SilenceAlert</button>
</form>
<hr>
</body>
</html>
`
func manage_alertsPageHandler(response http.ResponseWriter, request *http.Request) {
fmt.Fprintf(response, manage_alertsPage)
}
func silencealertPageHandler(response http.ResponseWriter, request *http.Request) {
err := request.ParseForm()
if err != nil {
// Handle error here via logging and then return
fmt.Fprintf(response, "There was an error processing form: " + err.Error())
return
}
fmt.Printf("%+v\n", request.Form)
fmt.Fprintf(response, manage_alertsPage)
}
// server main method
var router = mux.NewRouter()
func main() {
router.HandleFunc("/manage_alerts", manage_alertsPageHandler)
router.HandleFunc("/silencealert", silencealertPageHandler)
http.Handle("/", router)
http.ListenAndServe(":8000", nil)
}
爲細末項目的文件夾結構是
src/web
- main.go
- jquery-1.7.min.js
當我運行旅途項目：
go run main.go
瀏覽
localhost:8000/manage_alerts
單擊添加更多或刪除按鈕，沒有任何反應
需要一些幫助找出原因，當它被執行golang代碼就好了外部的JavaScript代碼不執行此。
它可能不喜歡你的jQuery路徑。你有沒有檢查你的控制檯的錯誤？提供內容文件時，您可能還需要將正確的內容類型添加到響應標頭中。 – Gavin