利用jQuery实现加盟留言板表单代码



16 63 22



特效描述:利用jQuery实现 加盟留言板 表单代码,利用jQuery实现加盟留言板表单代码

代码结构

1. 引入CSS

<link href="css/reset.css" rel="stylesheet" type="text/css">
<link href="css/style.css" rel="stylesheet" type="text/css">

2. 引入JS

<script src="js/jquery-1.8.2.min.js" type="text/javascript"></script>

3. HTML代码

<!-- 我要咨询 -->
<div class="wantConsult">
  <div class="wrap_mar">
    <div class="zxTitle clear">
      <p class="fl1 p1">我要咨询</p>
      <p class="fr1 p2"><i class="i14 fl1"><img src="images/zxphone.png" alt=""></i><span class="fl1">全国免费电话</span><i class="fl1 i15"><img src="images/shuzi.png" alt=""></i></p>
    </div>
    <div class="wantConsult_btm clear">
      <div class="wantConsult_btm_left fl1">
        <p class="sixPage">加盟六步法</p>
        <ul>
          <li class="clear"><i class="fl1 i16"></i><span class="fl1">直营店考察</span><font class="fl1">(具备可经营性)</font></li>
          <li class="clear"><i class="fl1 i17"></i><span class="fl1">加盟店考察</span><font class="fl1">(具备可复制性)</font></li>
          <li class="clear"><i class="fl1 i18"></i><span class="fl1">店面选址方式</span></li>
          <li class="clear"><i class="fl1 i19"></i><span class="fl1">总部培训方式</span></li>
          <li class="clear"><i class="fl1 i20"></i><span class="fl1">运营督导方式</span></li>
          <li class="clear"><i class="fl1 i21"></i><span class="fl1">产品研发能力</span></li>
        </ul>
        <p class="chanQuan">中国加盟网已获知识产权<br>
          登记号:国作登字-2018-A-8888888888</p>
      </div>
      <div class="wantConsult_btm_right fr1">
        <form action="" class="form fl1">
          <textarea name="content" id="areaCont" cols="30" rows="10" placeholder="请输入或选择咨询内容"></textarea>
          <p class="input_p clear"> <span class="span1 fl1" style="letter-spacing:10px;">姓名</span>
            <input type="text" maxlength="5" name="sname" value="请输入您的姓名" class="txt" >
            <font class="fr1">性别 <span class="radio_box">
            <input type="radio" id="radio_1" name="radio" checked="checked">
            <label for="radio_1"></label>
            <em>男</em> </span> <span class="radio_box">
            <input type="radio" id="radio_2" name="radio" >
            <label for="radio_2"></label>
            <em>女</em> </span> </font> </p>
          <p class="input_p clear"> <span class="span1 fl1" style="letter-spacing:10px;">手机</span>
            <input type="text"  name="mobile" id="mobile" maxlength="11" value="请输入您的手机" class="txt">
          </p>
          <p class="input_p clear"> <span class="span1 fl1">验证码</span>
            <input type="text" id="message_code" maxlength="4" value="请输入验证码" class="txt">
            <input class="span2 fr1" type="button" id="butn" value="获取验证码" onClick="send_code_for_message_new($(this))">
          </p>
          <p class="sub_ziXun">
            <input id="tijiaoliuyan" class="btn" type="button" value="提交咨询" onClick="return projectFootMessage();">
          </p>
        </form>
        <div class="select_yixiang fr1">
          <p class="jiao"></p>
          <p class="ninTitle">您可以根据意向选择下列 <em>[快捷留言]</em></p>
          <ul>
            <li><a href="javascript:void(0)" title="项目很好,请尽快联系我详谈。">项目很好,请尽快联系我详谈。</a></li>
            <li><a href="javascript:void(0)" title="请问我所在的地区有加盟商了吗?">请问我所在的地区有加盟商了吗?</a></li>
            <li><a href="javascript:void(0)" title="留下邮箱,请将详细资料邮件给我。">留下邮箱,请将详细资料邮件给我。</a></li>
            <li><a href="javascript:void(0)" title="想了解的加盟流程,请与我联系!">想了解的加盟流程,请与我联系!</a></li>
            <li><a href="javascript:void(0)" title="做为的代理加盟商能得到哪些支持?">做为的代理加盟商能得到哪些支持?</a></li>
            <li><a href="javascript:void(0)" title="请问投资所需要的费用有哪些?">请问投资所需要的费用有哪些?</a></li>
            <li><a href="javascript:void(0)" title="我想加盟,请电话联系我。">我想加盟,请电话联系我。</a></li>
            <li><a href="javascript:void(0)" title="加盟,有什么优惠?">加盟,有什么优惠?</a></li>
          </ul>
        </div>
      </div>
    </div>
  </div>
</div>
<script type="text/javascript"> 
		 $(".select_yixiang ul li a").each(function(){
		 	$(this).click(function(){
		 		var text=$(this).text();
		 		$("#areaCont").val(text)
		 	})
		 })
</script> 
<!-- 我要咨询 E--> 
<div style="text-align:center;margin:50px 0; font:normal 14px/24px 'MicroSoft YaHei';">
</div>



用户评论
大牛,别默默的看了,快登录帮我点评一下吧!:)      登录 | 注册


热门标签: 弹出层拖动 窗口 弹出 弹窗 弹出层 提示框 对话框 遮罩 遮罩层 弹窗插件 切换按钮 表单 表单美化 表单插件 表单美化插件 文字提示框 提示文字 文本框 text文本框 按钮控制

×
×

注册

官方QQ群

扫描上面二维码加微信群

官方QQ群

jQuery/js讨论群
群号:642649996
Css3+Html5讨论群
群号:322131262

加群请备注:从官网了解到