SurveyJS是一个强大的、可定制的跨平台调查/反馈/问卷调查/测验JavaScript库,专为jQuery、Angular、React、VueJS、knocket等设计。
支持的问题类型:输入、单选、复选框、下拉列表、矩阵、评分、图像选取器、评论、自定义功能等。
在问题之间共享数据。
打印为PDF。
分析调查结果。
支持条件逻辑。
标记和文本处理。
多种语言。
表单验证。
8个内置主题。
支持第三个插件:select2、jQuery UI日期选择器、Nouislider等等。
1.在页面上包含jQuery库和SurveyJS库的文件。
<script src="/path/to/cdn/jquery.min.js"></script> <script src="/path/to/survey.jquery.js"></script> <link href="/path/to/survey.css" type="text/css" rel="stylesheet"/>
2.使用JSON定义您的问题。您可以使用在线调查编辑器构建自己的JSON。
var json = { "completedHtml": "<h3>Thank you for your feedback.</h3> <h5>Your thoughts and ideas will help us to create a great product!</h5>", "completedHtmlOnCondition": [ { "expression": "{nps_score} > 8", "html": "<h3>Thank you for your feedback.</h3> <h5>We glad that you love our product. Your ideas and suggestions will help us to make our product even better!</h5>" }, { "expression": "{nps_score} < 7", "html": "<h3>Thank you for your feedback.</h3> <h5> We are glad that you share with us your ideas.We highly value all suggestions from our customers. We do our best to improve the product and reach your expectation.</h5>\n" } ], "pages": [ { "name": "page1", "elements": [ { "type": "rating", "name": "nps_score", "title": "On a scale of zero to ten, how likely are you to recommend our product to a friend or colleague?", "isRequired": true, "rateMin": 0, "rateMax": 10, "minRateDescription": "(Most unlikely)", "maxRateDescription": "(Most likely)" }, { "type": "checkbox", "name": "promoter_features", "visibleIf": "{nps_score} >= 9", "title": "What features do you value the most?", "isRequired": true, "validators": [ { "type": "answercount", "text": "Please select two features maximum.", "maxCount": 2 } ], "hasOther": true, "choices": [ "Performance", "Stability", "User Interface", "Complete Functionality" ], "otherText": "Other feature:", "colCount": 2 }, { "type": "comment", "name": "passive_experience", "visibleIf": "{nps_score} > 6 and {nps_score} < 9", "title": "What is the primary reason for your score?" }, { "type": "comment", "name": "disappointed_experience", "visibleIf": "{nps_score} notempty", "title": "What do you miss and what was disappointing in your experience with us?" } ] } ], "showQuestionNumbers": "off" };
3.创建一个容器来放置调查。
<div id="myContainer"></div>
4.根据您提供的JSON生成一个Surveer表单。
window.survey = new Survey.Model(json); $("#myContainer").Survey({ model: survey, onComplete: sendDataToServer });
5.示例JS显示了如何将结果发送到您的服务器。
function sendDataToServer(survey) { var resultAsString = JSON.stringify(survey.data); // send the resultAsString to the server }
6.示例JS显示了如何将结果发送到您的服务器。
function sendDataToServer(survey) { var resultAsString = JSON.stringify(survey.data); // send the resultAsString to the server }
7.设置你想要使用的主题。所有主题:
Survey.StylesManager.applyTheme("bootstrap"); Survey.StylesManager.applyTheme("orange"); Survey.StylesManager.applyTheme("darkblue"); Survey.StylesManager.applyTheme("darkrose"); Survey.StylesManager.applyTheme("stone"); Survey.StylesManager.applyTheme("winter"); Survey.StylesManager.applyTheme("winterstone");
v1.9.85 (2023-04-26)
更新和修复错误
v1.9.84 (2023-04-19)
更新和修复错误
v1.9.83 (2023-04-13)
更新和修复错误
v1.9.82 (2023-04-12)
更新和修复错误
v1.9.81 (2023-04-06)
更新和修复错误
v1.9.80 (2023-03-30)
更新和修复错误
v1.9.79 (2023-03-21)
更新和修复错误
v1.9.78 (2023-03-15)
更新和修复错误
v1.9.77 (2023-03-07)
使现代化
v1.9.69 (2023-02-21)
错误修复
v1.9.59 (2022-11-22)
错误修复