一样平常做竞价的朋友都会看到有些网站上的一个页面里面有多出的电话回拨入口，固定的，悬浮的。为了用户体验我们常常须要自定义这些入口，在一些网络部门有些技能是没打仗过这个东西，乃至只能加一个这样的代码，而再开一个觉得只有末了一个管用，之前的都失落效了。无法实现导致sem的职员只能作罢-做个加图片点击进去主动拨号。下面任伟就来详解下怎么办理一个页面里面增加多个回拨入口，知足大家的需求。
首先先展示下这边做的效果仿照在一个页面里面的效果图。
现在我们来展示下这些代码，逐个阐明代码事理：
先看一段代码：
来认识下这里的来个js代码，第一个代码表示：在实际用到时，实现和显示输入框的绑定的可以自定义;第二段代码：是指定用这个开通的此id对应接通号码的一段js，这是固定的无需修正，这段代码只须要在页面里涌现一次加载即可。
Markup
下面详细参考代码如下：
<!DOCTYPE html ><html><head><meta http-equiv=\"大众Content-Type\"大众 content=\公众text/html; charset=gb2312\"大众 /><meta name=\公众viewport\"大众 content=\公众width=device-width, minimum-scale=1.0, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0\公众><meta content=\公众yes\"大众 name=\公众apple-mobile-web-app-capable\"大众 /><meta content=\公众black\"大众 name=\"大众apple-mobile-web-app-status-bar-style\公众 /></head><body><style>
.tel-box{width:255px;height:84px;overflow:hidden;background:#ebecee}
.tel-box .tel-item{padding:8px 0 0 8px}
.tel-box .api-lxb-cb-input{color:#666;width:157px;border:0 none;height:32px;line-height:32px;margin-top:8px}
.tel-box .api-lxb-cb-btn{background:#ff5a00;border:0 none;overflow:hidden;text-align:center;color:#fff;width:74px;height:34px;line-height:34px;cursor:pointer;margin-top:8px}
.tel-box .api-lxb-cb-btn:hover{filter:alpha(opacity=80);-moz-opacity:.8;-khtml-opacity:.8;opacity:.8;transition:.3s linear}
.tel-box p{text-align:center;padding-top:5px; font-size:12px;}</style><script type=\公众text/javascript\"大众 language=\"大众javascript\"大众 src=\"大众jquery-1.7.2.min.js\"大众></script><!--第一个回拨框开始--><div class=\"大众tel-box\"大众>
<div class=\"大众tel-item\"大众>
<input type=\公众tel_***\公众 name=\"大众telInput\"大众 class=\"大众api-lxb-cb-input\"大众 id=\"大众telInput1\公众 value=\公众 请输入你的电话号码......\"大众 onBlur=\"大众if(this.value==''){this.value=' 请输入你的电话号码......'}\"大众 onFocus=\公众if(this.value==' 请输入你的电话号码......'){this.value='';}\公众/>
<input type=\"大众tel_btn\"大众 class=\"大众api-lxb-cb-btn\"大众 id=\"大众callBtn1\"大众 name=\公众callBtn\公众 value=\"大众免费拨打\"大众/>
</div>
<p>请输入电话号码，我们会主动联系您！
</p></div><script>
document.getElementById(\"大众callBtn1\"大众).onclick = function () {
lxb.call(document.getElementById(\"大众telInput1\"大众));
};
</script>
<!--第一个回拨框结束-->
<!--第二个回拨框开始--><div class=\"大众tel-box\"大众>
<div class=\"大众tel-item\"大众>
<input type=\公众tel_***\"大众 name=\公众telInput\"大众 class=\"大众api-lxb-cb-input\公众 id=\公众telInput2\"大众 value=\"大众 请输入你的电话号码......\公众 onBlur=\公众if(this.value==''){this.value=' 请输入你的电话号码......'}\"大众 onFocus=\公众if(this.value==' 请输入你的电话号码......'){this.value='';}\公众/>
<input type=\"大众tel_btn\公众 class=\"大众api-lxb-cb-btn\"大众 id=\"大众callBtn2\"大众 name=\"大众callBtn\"大众 value=\公众免费拨打\"大众/>
</div>
<p>请输入电话号码，我们会主动联系您！
</p></div><script>
document.getElementById(\"大众callBtn2\公众).onclick = function () {
lxb.call(document.getElementById(\"大众telInput2\"大众));
};</script> <!--第二个回拨框结束-->
<!--这是网呼代码的核心文件，一定要在页面加载--> <script>
document.write('<script type=\"大众text/javascript\"大众 data-lxb-uid=\"大众10358826\"大众 data-lxb-gid=\"大众162355\"大众 src=\公众http://lxbjs.baidu.com/api/asset/api.js?t=' + new Date().getTime() + '\"大众 charset=\"大众utf-8\公众></scr' + 'ipt>' );</script> <!--这是网呼代码的核心文件，一定要在页面加载-->
<!--中间弹窗代码--><script src=\"大众AdCenter.js\"大众 charset=\"大众utf-8\"大众></script><!--中间弹窗代码--></body></html>
<script>
document.getElementById(\公众callBtn2\"大众).onclick = function () {
lxb.call(document.getElementById(\"大众telInput2\"大众));
};
</script>
可以看出这里的第一段代码里的绑定id是根据你输入框和确认框的id来绑定的，这就不难阐明了，假如我用第一个回拨的话只要代码里对应好就行，那么不管我加多少个这样的东西，一样可以实现，当然我们在这里涉及到的中间的弹窗一样的道理。我会把这个参考测试的代码都会压缩成福建供大家参考。
这样往后便是轻微懂点seo技能的职员只要修正html或者js文件里的 代码id即可。
值得把稳的是
<!--这是网呼代码的核心文件，一定要在页面加载-->
<script>
document.write('<script type=\公众text/javascript\"大众 data-lxb-uid=\"大众10358826\"大众 data-lxb-gid=\"大众162355\公众 src=\"大众http://lxbjs.baidu.com/api/asset/api.js?t=' + new Date().getTime() + '\公众 charset=\"大众utf-8\"大众></scr' + 'ipt>' );
</script>
<!--这是网呼代码的核心文件，一定要在页面加载-->
这种代码是核心的每个人的都不一样，不能搞错，不然就给他人做了嫁衣，竞价开通好代码会发给你的到时候这个id便是你账户里对用设置好的号码等信息。或者你现每个页面麻烦，你可以加载在一个共用的js文件里面也是可以的。这样就实现了每个页面打开的时候都可以加载到。
末了附上我的代码：code.zip
分享来源： 任伟SEO博客 转载请注明出处！
(***:1047558139/微信:renweiseo)
原文地址:http://www.renweiseo.com/note/view/4308.html
