jquery.convform机器人自动聊天插件

jquery.convform机器人自动聊天插件源码下载

看看谁在用

查看文件结构

文件大小:0.05M

资源分类: 插件-其它前端代码

更新时间: 2021-06-02

jquery.convform是一个网页聊天窗口插件,主要特色是可以模拟机器人自动聊天,当前的数据为例子,可以调用后端API数据。

基础调用方法
$(function(){
  var convForm = $('.my-conv-form-wrapper').convform();
});
知道哪个问题,每一个输入和选择必须有data-conv-question属性
<select data-conv-question="Hello! I'm a bot created from a HTML form. Can I show you some features?">
	<option value="yes">Yes</option>
	<option value="sure">Sure!</option>
</select>
选择一个问题,用|分开
<input type="text" name="name" data-conv-question="Alright! First, tell me your full name, please.|Okay! Please, tell me your name first.">

使用正则表达式
<input data-conv-question="Type in your e-mail" data-pattern="^[a-zA-Z0-9.!#$%&’*+/=?^_`{|}~-]+@[a-zA-Z0-9-]+\.[a-zA-Z0-9-]+(?:\.[a-zA-Z0-9-]+)*$" type="email" name="email">

你可以叉谈话,问具体问题基于用户的答案。
<select name="programmer" data-conv-question="So, are you a programmer? (this question will fork the conversation based on your answer)">
	<option value="yes">Yes</option>
	<option value="no">No</option>
</select>
<div data-conv-fork="programmer">
	<div data-conv-case="yes">
	 	<input type="text" data-conv-question="A fellow programmer! Cool." data-no-answer="true">
	</div>
	<div data-conv-case="no">
		<select name="thought" data-conv-question="Have you ever thought about learning? Programming is fun!">
			<option value="yes">Yes</option>
			<option value="no">No..</option>
		</select>
	</div>
</div>
引用之前的回答
<input type="text" data-conv-question="Howdy, {name}:0! It's a pleasure to meet you. How's your day?">

如果不打算回答
<input type="text" data-conv-question="A fellow programmer! Cool." data-no-answer="true">

回调方法
<select data-conv-question="Selects also support callback functions. For example, try one of these:">
		<option value="google" data-callback="google">Google</option>
		<option value="bing" data-callback="bing">Bing</option>
</select>
<script>
	function google(stateWrapper, ready) {
		window.open("https://google.com");
		ready();
	}
	function bing(stateWrapper, ready) {
		window.open("https://bing.com");
		ready();
	}
</script>

提交表单的方法
$(function(){
  var convForm = $('.my-conv-form-wrapper').convform({
    eventList: {
        onSubmitForm: function(convState) {
            console.log('The form is being submitted!');
            convState.form.submit();
        }
    }
  });
});

jquery.convform机器人自动聊天插件

正在加载文件目录...

也许你还喜欢

  1. 精美的聊天系统和任务管理HTML模板
  2. jQuery和CSS3精美聊天窗口插件
  3. jQuery手机微信聊天窗口样式代码
  4. jQuery模拟QQ在线即时聊天窗口界面
  5. jQuery网页右下角弹出聊天窗口
  6. jquery手机端聊天界面插件自动聊天
简约办公家具网站bootstrap界面模板
  • 标签查找|关于我们|用户协议|格式化工具|bootstrapmb.com 版权所有 苏ICP备17077179号-2