在商务通对话窗口中添加离线宝的方法

模板网 2015-02-14

将以下代码通过商务通后台添加到商务通对话窗口中即可实现将离线宝加入商务通对话窗口。

需要将 <input id="uid" value="6026803" type="hidden" name="uid"> 中的 6026803替换为自己的开通了离线宝的百度推广账户ID

复制代码 代码如下:

<p>
<form id="lxb-data-form">
<input id="uid" value="6026803" type="hidden" name="uid">
<input id="ttk" type="hidden" name="ttk">
<input style="border:#339933 1px solid;padding:0 5px;width:200px;height:30px;" id="vtel" placeholder="输入电话号码  可请求专家回电..." />
<input style="border:none;background:#339933;height:30px;color:#fff;cursor:pointer;" id="cbBtn" onclick="lxbcb.getTk('vtel','cbBtn',false);" value="免费回拨" type="button" />
</form>
</p>
 
<script src="http://libs.baidu.com/jquery/1.9.1/jquery.min.js"></script>
<script type="text/javascript">
 (function(){
    var tk = '';
     var view = {};
     view.host = 'http://lxbjs.baidu.com';
     function G(id) {
         return document.getElementById(id);
     }
     function get(url, callback) {
         jQuery.getJSON(url + "&callback=?",callback);
     }
     function validateTel(str) {
         var res = true;
         if (str.charAt(0) == '1') {
             res = /^1[3458]\d{9}$/.test(str);
         }
         else {
             res = /^0\d{9,11}$/.test(str);
         }
         return res;
     };
     function telCB() {
         if (view.btn.disabled) {
             return;
         }
         var vtel = view.vtel.value;
         if (!validateTel(vtel)) {
             alert('请您输入正确的号码,手机号码请直接输入,座机请加区号', true);
             return false;
         }
         var form = G('lxb-data-form');
         var url = view.host + '/cb/call';
         url += '?vtel=' + vtel;
         url += '&uid=' + (form.uid ? form.uid.value : '');
         url += '&tk=' + tk;
         url += '&t=' + (new Date()).getTime();
         view.btn.value = '正在回呼...';
         view.btn.disabled = true;
 
         get(url, function (dataObj) {
          alert(dataObj.msg);
             if(0 == dataObj.status){
                 view.btn.disabled = false;
                 view.btn.value = '免费电话';
             }
         });
         if (view.storeTel && window.localStorage) {
             localStorage.setItem('tel', value);
         }
     }
     
     function getTk (telId,btnId,storeTel) {    
    view.storeTel = storeTel;
      view.vtel = G(telId);
      if(!view.vtel){
      alert('在页面中找不到输入框' + telId);
      return;
      }
      view.btn = G(btnId);
      if(!view.btn){
      alert('在页面中找不到按钮' + btnId);
      return;
      }        
if('' == tk){
      var url = view.host + '/cb/user/check';
         url += '?f=4&uid=' + (G('lxb-data-form').uid ? G('lxb-data-form').uid.value : '');
         url += '&r=' + encodeURIComponent((document.referer ? document.referer : location.href));
         url += '&t=' + (new Date()).getTime();
         get(url, function (dataObj) {
             if(0 == dataObj.status){
              G('ttk').value=dataObj.data.tk;
tk = dataObj.data.tk;
telCB();
             }else{
view.btn.disabled = true;
             }
         });
}else{
telCB();
}         
         if (view.storeTel && window.localStorage) {
             var tel = localStorage.getItem('tel');
             if (tel) {
              view.vtel.value = tel;
             }
         }
     }
     if(!window.lxbcb){window['lxbcb']={};}
     window['lxbcb']['getTk'] = getTk;
window['lxbcb']['telCB'] = telCB;
 })();
 </script>

在商务通对话窗口中展现的效果如下:

  1. &lt;title&gt;在商务通对话窗口中添加离线宝的方法&lt;/title&gt;
  2. &lt;p&gt;
  3. &lt;form id=&quot;lxb-data-form&quot;&gt;
  4. &lt;input id=&quot;uid&quot; value=&quot;6026803&quot; type=&quot;hidden&quot; name=&quot;uid&quot;&gt;
  5. &lt;input id=&quot;ttk&quot; type=&quot;hidden&quot; name=&quot;ttk&quot;&gt;
  6. &lt;input style=&quot;border:#339933 1px solid;padding:0 5px;width:200px;height:30px;&quot; id=&quot;vtel&quot; placeholder=&quot;输入电话号码 可请求专家回电...&quot; /&gt;
  7. &lt;input style=&quot;border:none;background:#339933;height:30px;color:#fff;cursor:pointer;&quot; id=&quot;cbBtn&quot; onclick=&quot;lxbcb.getTk(&#039;vtel&#039;,&#039;cbBtn&#039;,false);&quot; value=&quot;免费回拨&quot; type=&quot;button&quot; /&gt;
  8. &lt;/form&gt;
  9. &lt;/p&gt;
  10. &lt;script src=&quot;http://libs.baidu.com/jquery/1.9.1/jquery.min.js&quot;&gt;&lt;/script&gt;
  11. &lt;script type=&quot;text/javascript&quot;&gt;
  12. (function(){
  13. var tk = &#039;&#039;;
  14. var view = {};
  15. view.host = &#039;http://lxbjs.baidu.com&#039;;
  16. function G(id) {
  17. return document.getElementById(id);
  18. }
  19. function get(url, callback) {
  20. jQuery.getJSON(url + &quot;&amp;callback=?&quot;,callback);
  21. }
  22. function validateTel(str) {
  23. var res = true;
  24. if (str.charAt(0) == &#039;1&#039;) {
  25. res = /^1[3458]\d{9}$/.test(str);
  26. }
  27. else {
  28. res = /^0\d{9,11}$/.test(str);
  29. }
  30. return res;
  31. };
  32. function telCB() {
  33. if (view.btn.disabled) {
  34. return;
  35. }
  36. var vtel = view.vtel.value;
  37. if (!validateTel(vtel)) {
  38. alert(&#039;请您输入正确的号码,手机号码请直接输入,座机请加区号&#039;, true);
  39. return false;
  40. }
  41. var form = G(&#039;lxb-data-form&#039;);
  42. var url = view.host + &#039;/cb/call&#039;;
  43. url += &#039;?vtel=&#039; + vtel;
  44. url += &#039;&amp;uid=&#039; + (form.uid ? form.uid.value : &#039;&#039;);
  45. url += &#039;&amp;tk=&#039; + tk;
  46. url += &#039;&amp;t=&#039; + (new Date()).getTime();
  47. view.btn.value = &#039;正在回呼...&#039;;
  48. view.btn.disabled = true;
  49. get(url, function (dataObj) {
  50. alert(dataObj.msg);
  51. if(0 == dataObj.status){
  52. view.btn.disabled = false;
  53. view.btn.value = &#039;免费电话&#039;;
  54. }
  55. });
  56. if (view.storeTel &amp;&amp; window.localStorage) {
  57. localStorage.setItem(&#039;tel&#039;, value);
  58. }
  59. }
  60. function getTk (telId,btnId,storeTel) {
  61. view.storeTel = storeTel;
  62. view.vtel = G(telId);
  63. if(!view.vtel){
  64. alert(&#039;在页面中找不到输入框&#039; + telId);
  65. return;
  66. }
  67. view.btn = G(btnId);
  68. if(!view.btn){
  69. alert(&#039;在页面中找不到按钮&#039; + btnId);
  70. return;
  71. }
  72. if(&#039;&#039; == tk){
  73. var url = view.host + &#039;/cb/user/check&#039;;
  74. url += &#039;?f=4&amp;uid=&#039; + (G(&#039;lxb-data-form&#039;).uid ? G(&#039;lxb-data-form&#039;).uid.value : &#039;&#039;);
  75. url += &#039;&amp;r=&#039; + encodeURIComponent((document.referer ? document.referer : location.href));
  76. url += &#039;&amp;t=&#039; + (new Date()).getTime();
  77. get(url, function (dataObj) {
  78. if(0 == dataObj.status){
  79. G(&#039;ttk&#039;).value=dataObj.data.tk;
  80. tk = dataObj.data.tk;
  81. telCB();
  82. }else{
  83. view.btn.disabled = true;
  84. }
  85. });
  86. }else{
  87. telCB();
  88. }
  89. if (view.storeTel &amp;&amp; window.localStorage) {
  90. var tel = localStorage.getItem(&#039;tel&#039;);
  91. if (tel) {
  92. view.vtel.value = tel;
  93. }
  94. }
  95. }
  96. if(!window.lxbcb){window[&#039;lxbcb&#039;]={};}
  97. window[&#039;lxbcb&#039;][&#039;getTk&#039;] = getTk;
  98. window[&#039;lxbcb&#039;][&#039;telCB&#039;] = telCB;
  99. })();
  100. &lt;/script&gt;

相关文章

  1. 手机站底部邀请电话咨询,商务通咨询

    手机站底部邀请电话咨询,商务通咨询,深绿色背景,包含拨打免费电话,在线咨询。 效果图:

  2. 很炫的商务通效果

    很炫的商务通效果 在线演示: 很炫的商务通效果 下载: 很炫的商务通效果 效果截图:

  3. 很好看的手机站底部

    很好看的手机站底部,每个按钮宽度都是自适应的,适合不同屏幕分辨率的手机。代码整理格式化,去除无用代码,方便使用与修改。 效果截图: 打包下载: 很好看的手机站底部

  4. 在商务通对话窗口中添加离线宝的方法

    将以下代码通过商务通后台添加到商务通对话窗口中即可实现将离线宝加入商务通对话窗口。 需要将 input id=uid value= 6026803 type=hidden name=uid 中的 6026803 替换为自己的开通了离线宝的百度推广账户ID 复制代码 代码如下: p form id=lxb-data-form inp

  5. 自定义商务通二次弹出原理

    自定义商务通二次弹出原理,商务通窗口被关闭后,指定时间后再次弹出。演示代码仅使用纯色作为弹出窗背景,实际运用中可替换为图片。 核心代码: 复制代码 代码如下: script function hideSwt(){ document.getElementById(swtBox).style.display=none;//隐藏

随机推荐

  1. 手机站底部邀请电话咨询,商务通咨询

    手机站底部邀请电话咨询,商务通咨询,深绿色背景,包含拨打免费电话,在线咨询。 效果图:

  2. 很炫的商务通效果

    很炫的商务通效果 在线演示: 很炫的商务通效果 下载: 很炫的商务通效果 效果截图:

  3. 很好看的手机站底部

    很好看的手机站底部,每个按钮宽度都是自适应的,适合不同屏幕分辨率的手机。代码整理格式化,去除无用代码,方便使用与修改。 效果截图: 打包下载: 很好看的手机站底部

  4. 在商务通对话窗口中添加离线宝的方法

    将以下代码通过商务通后台添加到商务通对话窗口中即可实现将离线宝加入商务通对话窗口。 需要将 input id=uid value= 6026803 type=hidden name=uid 中的 6026803 替换为自己的开通了离线宝的百度推广账户ID 复制代码 代码如下: p form id=lxb-data-form inp

  5. 自定义商务通二次弹出原理

    自定义商务通二次弹出原理,商务通窗口被关闭后,指定时间后再次弹出。演示代码仅使用纯色作为弹出窗背景,实际运用中可替换为图片。 核心代码: 复制代码 代码如下: script function hideSwt(){ document.getElementById(swtBox).style.display=none;//隐藏