This jQuery plug-in allows user to easily add an animatable UI widget with a feedback form which slides from the side of the screen.
feedback_me 在使用后的效果如下:
效果圖
它會(huì)附著在窗口的一邊,點(diǎn)擊后會(huì)出現(xiàn)信息表,填寫完成后點(diǎn)擊提交即可草描,提交完成后feedbach_me 會(huì)將填寫的信息通過post請求發(fā)送到你指定的url地址泌豆,你可以在后臺寫一個(gè)controller專門負(fù)責(zé)接收這個(gè)請求。這個(gè)插件的好處在于整個(gè)過程使用簡單壹罚、有效恤筛,只需要通過簡單的配置就能完成乳怎。
官方的文檔的地址: http://plugins.jquery.com/feedback_me github的地址: https://github.com/vedmack/feedback_me
看一下如何使用它:
首先他是一個(gè)jQuery 插件祟偷,需要在一開始引入jQuery,然后引入它指定的js和css文件即可打厘。
上圖例子實(shí)現(xiàn)的代碼:
<link href="../../styles/jquery/jquery.feedback_me.css" rel="stylesheet" type="text/css">
<script type="text/javascript" src="../../scripts/jquery/jquery.min.js"></script>
<script type="text/javascript" src="../../scripts/jquery/plugin/jquery.feedback_me.js"></script>
<script type="text/javascript">
$(document).ready(function(){
fm_options = {
// 這個(gè)參數(shù)是設(shè)置這個(gè)反饋按鈕在頁面的哪個(gè)位置修肠,left-bottom ...
position: "right-top",
// 是否顯示郵箱
show_email: true,
email_label: "郵箱",
email_required: true,
// 單選框
show_radio_button_list: true,
radio_button_list_labels: ["1", "2", "3", "4", "5"],
radio_button_list_title: "給個(gè)好評哦...",
radio_button_list_required: false,
//
name_required: true,
name_label: "名字",
//
message_label: "反饋信息",
message_required: true,
show_asterisk_for_required: true,
// 這個(gè)很重要,這是提交后信息發(fā)送到哪里
feedback_url: "http://.../feedback/message",
// 提交信息后提示
delayed_options: {
send_fail : "提交失敗 :(. ",
send_success : "提交成功户盯,謝謝參與反饋嵌施,^_^ !"
},
submit_label: "提交",
// 頁面按鈕提示信息
trigger_label: "意見反饋"
};
//init feedback_me plugin
fm.init(fm_options);
});
</script>